Issue with aDataSort' of undefined

Moti

Hi Guys,
I'm scratching my head for couple of hours by now and can't find why I'm getting this issue "aDataSort' of undefined"

Here is what I'm doing:
first I create my table through javascript as all my tables come dynamically from the server:
This is how my Dom look like:

now in my javascript side I inject table like:
$(document).ready(function () {
var mainDiv = $("#grid_main");
mainDiv.html('

') var table = $("#grid_table") table.html("") table.html(''); for (var i = 0; i < data.length; i++) { //tableBody.append('') table.append('') //tableBody.append(""); } table.html('') table.html('

Name	Last	Age	Gender
' + data[i][0] + '	' + data[i][1] + '	' + data[i][2] + '	' + data[i][3] + '

')

//now I'm running datatables plugin;
$("#grid_table").DataTable();
});

here is my data:
var data = [
["Ilay sdfsdf", "mashiah sdfsdf", "6", "male"],
["Vanus sdfsdfsd", "Craig sdfsdfsd", "33", "female"],
["Joen", "Moskil", "40", "male"],
["Bonny", "Katine", "31", "Female"],
]

Please Help:

kthorngren

I suspect your html table is being built correctly. The error you are getting can occur if the table is not correct. It doesn't seem like your code snippets will work but I may be missing something due to the formatting. Take a look at the page source to see if the table is correctly built. Maybe you can build a test case showing us what you are doing.

If you build the thead correctly you could use this to populate all the data in your array variable data.

$("#grid_table").DataTable({
  data: data
});

Kevin

Moti

Issue solved
I just rewrite the dom again. It seems that I didn't write it properly.

var mainDiv = $("#grid_main");
mainDiv.html('

')
var tablethead = $("#grid_table thead")
tablethead.html("<tr><th>Name</th><th>Last</th><th>Age</th><th>Gender</th></tr>")
var tabletbody = $("#grid_table tbody")
for (var i = 0; i < data.length; i++) {
//tableBody.append('<tr>')
tabletbody.append('<tr><td>' + data[i][0] + '</td><td>' + data[i][1] + '</td><td>' + data[i][2] + '</td><td>' + data[i][3] + '</td></tr>');
//tableBody.append("</tr>");
}