Javascript I';m收到此错误-$.fn.dataTable.Editor在使用dataTable内联编辑功能时不是构造函数错误?
我试图在dataTable中添加编辑行功能。 我参考了dataTable官方文件-()。 但是它显示了这个错误-$.fn.dataTable.Editor不是构造函数 如何在数据表中使用编辑行方法 HTML:Javascript I';m收到此错误-$.fn.dataTable.Editor在使用dataTable内联编辑功能时不是构造函数错误?,javascript,html,jquery,twitter-bootstrap,datatable,Javascript,Html,Jquery,Twitter Bootstrap,Datatable,我试图在dataTable中添加编辑行功能。 我参考了dataTable官方文件-()。 但是它显示了这个错误-$.fn.dataTable.Editor不是构造函数 如何在数据表中使用编辑行方法 HTML: 您是否使用免费试用版的文件? 确保您在试用期内购买了编辑器或获得了更新的文件 <link rel="stylesheet" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.mi
您是否使用免费试用版的文件? 确保您在试用期内购买了编辑器或获得了更新的文件
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.6.3/css/buttons.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/select/1.3.1/css/select.dataTables.min.css">
<link rel="stylesheet" href="https://editor.datatables.net/extensions/Editor/css/editor.dataTables.min.css">
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th></th>
<th>First name</th>
<th>Last name</th>
<th>Position</th>
<th>Office</th>
<th width="18%">Start date</th>
<th>Salary</th>
</tr>
</thead>
</table>
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.3/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/select/1.3.1/js/dataTables.select.min.js"></script>
<script src="https://editor.datatables.net/extensions/Editor/js/dataTables.editor.min.js"></script>
var editor;
$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
ajax: "./staff.php",
table: "#example",
fields: [ {
label: "First name:",
name: "first_name"
}, {
label: "Last name:",
name: "last_name"
}, {
label: "Position:",
name: "position"
}, {
label: "Office:",
name: "office"
}, {
label: "Extension:",
name: "extn"
}, {
label: "Start date:",
name: "start_date",
type: "datetime"
}, {
label: "Salary:",
name: "salary"
}
]
} );
$('#example').on( 'click', 'tbody td:not(:first-child)', function (e) {
editor.inline( this, {
submit: 'allIfChanged'
} );
} );
$('#example').DataTable( {
dom: "Bfrtip",
ajax: "./staff.php",
columns: [
{
data: null,
defaultContent: '',
className: 'select-checkbox',
orderable: false
},
{ data: "first_name" },
{ data: "last_name" },
{ data: "position" },
{ data: "office" },
{ data: "start_date" },
{ data: "salary", render: $.fn.dataTable.render.number( ',', '.', 0, '$' ) }
],
order: [ 1, 'asc' ],
select: {
style: 'os',
selector: 'td:first-child'
},
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]
} );
} );