Unable to populate table with AJAX JSON dataset?
Unable to populate table with AJAX JSON dataset?
TimeBomb006
Posts: 2Questions: 1Answers: 1
I'm attempting to load a table with a JSON dataset via an AJAX call to a web service. The web service returns the correct JSON (with the data object as the root), but I'm receiving the following error:
DataTables warning: tableid=example - Requested unknown parameter '1' for row 0. For more information about this error, please see http://datatables.net/tn/4
And so on.. as I scroll down the table.
Additionally, DataTables is populating the table with 1159 rows of individual characters, instead of the 5 rows found in my JSON result set. This result set is directly copied from the json.d object in the dataSrc property in my initialization.
I've viewed the error reference page, and have tried many different initialization options, but I cannot get the datatable initialized correctly. If I take the JSON response, put it in a text file, and use a data file as the source, it works just fine, but something about the web service and dataSrc property are screwing things up.
I use a simple table:
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Project ID</th>
<th>Project Name</th>
<th>Project Launch Name</th>
</tr>
</thead>
</table>
And seemingly straightforward initialization:
$('#example').dataTable({
"dom": "frtS",
"scrollY": "300px",
"deferRender": true,
"ajax": {
"dataType": "json",
"contentType": "application/json; charset=utf-8",
"type": "POST",
"url": "Default.aspx/GetSearchResults",
"dataSrc": function (json) {
//return $.parseJSON(json.d);
return json.d;
},
"columns": [
{ "data": "ProjectID" },
{ "data": "ProjectName" },
{ "data": "ProjectLaunchName" }
]
}
});
This question has an accepted answers - jump to answer
Answers
I incorrectly included the
columnsproperty array inside theajaxobject, where it should have been inline withdom,scrollY, etc. Corrected code below fixed the issue:Good to hear you got it sorted out!
Allan