I am getting an error $.fn.dataTable.Editor is not a constructor
I am getting an error $.fn.dataTable.Editor is not a constructor
rk123
Posts: 3Questions: 1Answers: 0
The are the scripts and css i am using and below is my datatable editor code
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href=" https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css" />
<link rel="stylesheet" type="text/css" href=" https://cdn.datatables.net/buttons/1.6.1/css/buttons.dataTables.min.css" />
<link rel="stylesheet" type="text/css" href=" https://cdn.datatables.net/select/1.3.1/css/select.dataTables.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/bs-3.3.7/jq-3.3.1/dt-1.10.20/datatables.min.js"></script>
<script type="text/javascript" src=" https://code.jquery.com/jquery-3.3.1.js"></script>
<script type="text/javascript" src=" https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src=" https://cdn.datatables.net/select/1.3.1/js/dataTables.select.min.js"></script>
<script type="text/javascript" src=" https://editor.datatables.net/extensions/Editor/js/dataTables.editor.min.js"></script>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<table id="MyTable" class="table" cellspacing="0" width="100%">
<thead>
<tr>
<th>id</th>
<th>name </th>
<th>email </th>
<th>body </th>
</tr>
</thead>
<tfoot>
<tr>
<th>id</th>
<th>name </th>
<th>email </th>
<th>body </th>
</tr>
</tfoot>
</table>
<script>
var editor; // use a global for the submit and return data rendering in the examples
$(document).ready(function () {
editor = new $.fn.dataTable.editor({
ajax: {
url: "https://jsonplaceholder.typicode.com/comments",
"dataType": "jsonp",
"dataSrc": ""
},
table: "#MyTable",
fields: [{
"label": "id:",
"name": "id"
}, {
"label": "name:",
"name": "name"
}, {
"label": "email:",
"name": "email"
}, {
"label": "body:",
"name": "body"
}
]
});
var table = $('#MyTable').DataTable({
dom: "Bfrtip",
ajax: {
url: "https://jsonplaceholder.typicode.com/comments",
"dataType": "jsonp",
"dataSrc": ""
},
columns: [
{ data: "id" },
{ data: "name" },
{ data: "email" },
{ data: "body" }
],
select: true,
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{
extend: "selected",
text: 'Delete',
action: function (e, dt, node, config) {
var rows = table.rows({ selected: true }).indexes();
editor
.hide(editor.fields())
.one('close', function () {
setTimeout(function () { // Wait for animation
editor.show(editor.fields());
}, 500);
})
.edit(rows, {
title: 'Delete',
message: rows.length === 1 ?
'Are you sure you wish to delete this row?' :
'Are you sure you wish to delete these ' + rows.length + ' rows',
buttons: 'Delete'
})
.val('users.removed_date', (new Date()).toISOString().split('T')[0]);
}
}
]
});
});</script>
</body>
</html>
This discussion has been closed.
Answers
I have followed the code in the examples and included all the scripts and css files in my system. still it is giving the error. Please help me to fix this asap
Can any one help me with exact solution.
You're including two versions of jQuery, and two loads of the DataTables libraries. They only need to be included once.
If still not working, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin