I am getting an error after clicking the create button on a Editor form to create a new record. However, the datatable populates correctly and editing an existing row works fine. The Editor form has both my selects populated correctly and selects the correct values on edit. I am using AJAX to get a set of customers with options appended for customer types. The error I am getting is:
DataTables warning: table id=tblcustomers - Requested unknown parameter 'custtype' for row 3, column 2. For more information about this error, please see http://datatables.net/tn/4
I think I am using latest version of DataTables and Editor. From datatables.min.js:
Included libraries: JSZip 2.5.0, pdfmake 0.1.18, DataTables 1.10.13, AutoFill 2.1.3, Buttons 1.2.4, Column visibility 1.2.4, Flash export 1.2.4, HTML5 export 1.2.4, Print view 1.2.4, ColReorder 1.3.2, Editor 1.6.1, FixedColumns 3.2.2, FixedHeader 3.1.2, KeyTable 2.2.0, Responsive 2.1.0, RowReorder 1.2.0, Scroller 1.4.2, Select 1.2.0
HTML/JAVASCRIPT
<!doctype html>
<html lang="us">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BlueFlame Process Management - Customers</title>
<link href="css/jquery-ui.css" rel="stylesheet">
<link href="css/BlueFlame.css" rel="stylesheet">
<link href="css/datatables.min.css" rel="stylesheet">
<script src="js/jquery.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/datatables.min.js"></script>
<script>
var editor_customer; // global editor object
$(document).ready(function() {
editor_customer = new $.fn.dataTable.Editor( {
ajax: "cgi-bin/Customer.py",
// ajax: "cgi-bin/params.py",
table: "#tblcustomers",
idSrc: 'id',
fields: [ {
label: "Id:",
name: "id",
type: "readonly",
}, {
label: "Name:",
name: "name"
}, {
label: "Customer Type:",
name: "custtypeid",
type: "select"
}, {
label: "Priority:",
name: "priority",
type: "select",
options: [
{ label: "No", value: "N" },
{ label: "Yes", value: "Y" }
]
}
]
} );
$('#tblcustomers').DataTable( {
dom: "Bfrtip",
ajax: {
url: 'cgi-bin/Customer.py?action=search&status=All',
dataSrc: 'Customers'
},
columns: [
{ data: 'id' },
{ data: 'name' },
{ data: 'custtype' },
{ data: 'priority' }
],
select: true,
buttons: [
{ extend: "create", editor: editor_customer },
{ extend: "edit", editor: editor_customer },
{ extend: "remove", editor: editor_customer }
]
} );
} );
</script>
</head>
<body>
<table id="tblcustomers" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Type</th>
<th>Priority</th>
</tr>
</thead>
</table>
</body>
</html>
AJAX from Server
{
"Customers": [{
"priority": "Y",
"name": "ALAN ",
"custtype": "Standard Fabricator",
"custtypeid": "2",
"id": "2"
}, {
"priority": "N",
"name": "Eric",
"custtype": "Retail",
"custtypeid": "1",
"id": "8"
}, {
"priority": "N",
"name": "MOVING PROS",
"custtype": "Standard Fabricator",
"custtypeid": "2",
"id": "1"
}, {
"priority": "N",
"name": "test",
"custtype": "Retail",
"custtypeid": "1",
"id": "9"
}],
"options": {
"custtypeid": [{
"status": "Active",
"label": "Retail",
"value": "1"
}, {
"status": "Active",
"label": "Standard Fabricator",
"value": "2"
}, {
"status": "Active",
"label": "Special",
"value": "3"
}]
}
}
