I have many datatables on my page and i have a generic method which populates them, and they all work fine apart from one.
My ajax method is as follows:
function AjaxGet(url, tableName) {
$.ajax({
method: 'GET',
url: url,
dataType: 'json',
contentType: 'application/json; charset=utf-8',
success: function (data) {
$('#' + tableName).dataTable({
destroy: true,
'bPaginate': false,
'aoColumns': DetermineColumns(tableName),
'aaData': data,
'sDom': '<"top">t<"bottom"><"clear">',
'bSort': false
});
}
});
};
aoColumns
return [
{
'mDataProp': 'PartNum'
},
{
'mDataProp': 'ukstk'
},
{
'mDataProp': 'ukfob'
},
{
'mDataProp': 'de'
},
{
'mDataProp': 'fr'
},
{
'mDataProp': 'es'
},
{
'mDataProp': 'ae'
},
{
'mDataProp': 'usa'
},
{
'mDataProp': 'mx'
},
{
'mDataProp': 'jx'
}
];
<div class="row">
<div class="col-md-6">
<table id="stdCostTable" class="table input">
<thead>
<tr>
<th></th>
<th>
UK-STK
</th>
<th>
UK-FOB
</th>
<th>
DE
</th>
<th>
FR
</th>
<th>
ES
</th>
<th>
AE
</th>
<th>
USA
</th>
<th>
MX
</th>
<th>
JX
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
I think data
should be an array of objects (or arrays), not an object per se. Check the initialization example (I assume you're using a legacy version)