Hi,
My page worked with Datatable. I am trying to add "Editor". I get an error loading the page (screenshot attached)
Unhandled exception at line 3881, column 3 in http://localhost:56296/Datatables/datatables.js
0x800a01bd - JavaScript runtime error: Object doesn't support this action..
COuld you give me some Help please?
Now, my code:
Includes:
<script src="/Datatables/datatables.js"></script>
<script src="/Datatables/DataTables-1.10.16/js/jquery.dataTables.js"></script>
<script src="/Datatables/Buttons-1.5.1/js/dataTables.buttons.js"></script>
<script src="/Datatables/Select-1.2.4/js/dataTables.select.min.js"></script>
<script src="/Datatables/KeyTable-2.3.2/js/dataTables.keyTable.min.js"></script>
the table:
<h3>Aubes de Diffuseur</h3>
<table class="display" id="aubeTable">
<thead>
<tr>
<th></th><th>id col</th><th>nom col</th><th>id aube</th>
<th>nomAube</th><th>numéro aube</th>
</tr>
</thead>
</table>
my script:
<script>
var editor;
$(document).ready(function () {
editor = new $.fn.dataTable.Editor({
ajax: "/MultiTableTest/_UpdateDataAube",
idSrc: "id",
table: "#aubeTable",
fields: [{
label: "Id collecteur:",
name: "idCollecteur",
type: "readonly"
},
{
label: "Nom collecteur:",
name: "nomCollecteur",
type: "readonly"
}, {
label: "Id aube:",
name: "id",
type: "readonly"
}, {
label: "Nom aube:",
name: "nomAube"
}, {
label: "Numero aube:",
name: "numeroAube"
}
],
formOptions: {
inline: {
onBlur: 'submit'
}
}
});
$('#aubeTable').dataTable({
"ajax": {
"url": "/MultiTableTest/_loadDataAube",
"type": "GET",
"datatype":"json"
},
"columns": [
{
"data": null,
"defaultContent": "",
"className": "select-checkbox",
"orderable": false
},
{ "data": "idCollecteur", "autoWidth": true, "searchable": false },
{ "data": "nomCollecteur", "autoWidth": true, "defaultContent": "-" },
{ "data": "idAube", "autoWidth": true, "visible": false, "searchable": false },
{ "data": "nomAube", "autoWidth": true },
{ "data": "numeroAube", "autoWidth": true }
],
"keys": {
columns: ':not(:first-child)',
keys: [9],
editor: editor,
editOnFocus: true
},
"select":true,
"buttons": [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]
});
});
</script>