$.fn.dataTable.Editor is not a constructor error
$.fn.dataTable.Editor is not a constructor error
Hello everyone,
I am try to make edit/delete button on every row in my datatable. I am trying to make it with editor but when i add this editor part to my code it, i cannot see my table at all, only the titles show up. It gives me this
$.fn.dataTable.Editor is not a constructor
error. Here is my full code I am working with mvc.
@{
ViewBag.Title = "Login";
}
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.20/b-1.6.1/datatables.min.css" />
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/tabletools/2.2.3/css/dataTables.tableTools.css">
<link rel="stylesheet" type="text/css" href="https://editor.datatables.net/extensions/Editor/css/editor.dataTables.min.css" />
<meta charset=utf-8 />
Person
name | surname | Edit / Delete |
---|
@section scripts
{
<script type="text/javascript" src="//code.jquery.com/jquery-3.3.1.js"></script>
<script type="text/javascript" src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="//cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="//cdn.datatables.net/select/1.3.1/js/dataTables.select.min.js"></script>
<script type="text/javascript" src="//editor.datatables.net/extensions/Editor/js/dataTables.editor.min.js"></script>
<script>
var editor;
$(document).ready(function () {
editor = new $.fn.dataTable.Editor({
table: "#table",
fields: [{
label: "First name:",
name: "first_name"
}
]
});
$('#table').on('click', 'a.editor_remove', function (e) {
e.preventDefault();
editor.remove($(this).closest('tr'), {
title: 'Delete record',
message: 'Are you sure you wish to remove this record?',
buttons: 'Delete'
});
});
$('#table').DataTable(
{
ajax: {
"url": "myurl",
"type": "GET",
"datatype": "json",
"dataSrc": "person"
},
aoColumns: [
{ mData: 'name' },
{ mData: 'surname' },
{ mData: 'email' },
{ defaultContent: '<input type="button" class="Edit" value="Edit"/><input type="button" class="Delete" value="Delete"/>' }
],
});
$('#table tbody').on('click', '.Edit', function () {
alert("world");
});
});
</script>
}
@Html.ActionLink("Back to List", "Index")
This question has an accepted answers - jump to answer
Answers
There are lots of threads asking about this error, such as:
https://datatables.net/forums/discussion/comment/154363/#Comment_154363
https://datatables.net/forums/discussion/comment/114239/#Comment_114239
Are you using the trial version of Editor? If so it may be expired.
Kevin
I just looked at your import statements:
<script type="text/javascript" src="//editor.datatables.net/extensions/Editor/js/dataTables.editor.min.js"></script>
For Editor you need to install the code locally and load it from your local server. Since it is a licensed product you aren't allowed to load it via the internet.
Kevin