Laravel app.js与Datatables冲突
我在一个laravel项目中使用数据表。但是似乎datatables.min.js的app.js与laravels冲突，我在控制台中得到了这个错误。
Uncaught TypeError: $(...).DataTable is not a function
如果我从head中删除app.js，一切都与数据表相关，但随后引导程序、菜单下拉菜单和其他一些与js相关的东西明显停止工作，因为我删除了app.js，我如何才能通过在head部分同时包含这两个部分来解决这个问题？
更新：是我的laravel应用程序的头部部分。Laravel版本是最新的5.6
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="Yhn7OFsFoV2qKhwsF7URC9GzjwNIb8muUT2u5kkD">
<title>Application</title>
<script src="http://127.0.0.1:8000/js/app.js" defer></script>
<script src="http://127.0.0.1:8000/js/datatables.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#users').DataTable({
processing: true,
serverSide: true,
searching: true,
filter: true,
ajax: 'http://127.0.0.1:8000/api/users/data',
columnDefs: {
targets: [-1],
visible: false,
searchable: true,
},
columns: [
{data: 'id', name: 'id'},
{data: 'name', name: 'name', sortable: false},
{data: 'email', name: 'email', sortable: false},
{data: 'role', name: 'role'},
{data: 'created_at', name: 'created_at'},
],
initComplete: function() {
this.api().columns([2]).every(function () {
var column = this;
var input = document.createElement("input");
input.classList.add('form-control');
input.setAttribute('placeholder', 'search by email..');
input.setAttribute('name', 'search-email');
$(input).appendTo($(column.header()).empty())
.on('change', function () {
column.search($(this).val(), false, false, true).draw();
});
});
$('.dataTables_filter input[type="search"]').addClass('form-control');
}
});
});
</script>回答 5
Stack Overflow用户
发布于 2018-06-08 02:11:57
这是因为您可以通过app.js使用jquery，并且您可能再次链接了jquery for datatable。尝试删除jquery的链接，它应该可以工作。
Stack Overflow用户
发布于 2018-06-07 23:57:24
首先，您没有指定Laravel版本，所以我假设它是最新的稳定版本。
其次，你没有说你是如何安装数据表的，我想你只是手动包含了精简的源代码。
根据Documentation，您应该能够通过package.json文件安装datatables (使用npm或yarn，取决于您的偏好)。
需要说明的是，NPM repo：https://datatables.net/download/npm中提供了datatables包
Stack Overflow用户
发布于 2018-10-12 16:05:16
您可以用Bootstrap替换laravel默认的JS和CSS。bootstrap javascript的工作方式与App.js相同。替换laravel默认设置的另一个好处是Bootstrap会让您创建管理模板，就像pages.That为我工作一样
https://stackoverflow.com/questions/50745515
复制相似问题