undefined error when trying to do simple server side load??
undefined error when trying to do simple server side load??
Hi,
I've been looking at this thread and I am also using c# and ASP.NET MVC. However I am having troubles getting the data to load into the table. I am trinyg a very simple example but it keeps coming back saying "Microsoft JScript error: 'undefined' is null or not an object" from the jquery.datatable.min.js file
It happens on line 440 which is [code]{var aColumns=sColumns.split(",")[/code]
My controller is
[code]
public JsonResult Json()
{
JsonResult res = null;
object[] aa = new object[1];
Reps reps = new Reps();
reps.Name = "John";
reps.Job = "Plumber";
aa[0] = reps;
var o = new
{
sEcho = 1,
iTotalRecords = 1,
iTotalDisplayRecords = 1,
aaData = aa
};
res = Json(o);
return res;
}
[/code]
my jquery file is
[code]
var oTable;
$(document).ready(function() {
//event handlers
$("#uxAddReferral").click(OnAddReferralClick);
$('#demo').html('');
//setup the grid
oTable = $('#uxReferralTable').dataTable(
{
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "/Referral/Json"
}
);
});
[/code]
html file is (actually .spark)
[code]
[/code]
any ideas??
I've been looking at this thread and I am also using c# and ASP.NET MVC. However I am having troubles getting the data to load into the table. I am trinyg a very simple example but it keeps coming back saying "Microsoft JScript error: 'undefined' is null or not an object" from the jquery.datatable.min.js file
It happens on line 440 which is [code]{var aColumns=sColumns.split(",")[/code]
My controller is
[code]
public JsonResult Json()
{
JsonResult res = null;
object[] aa = new object[1];
Reps reps = new Reps();
reps.Name = "John";
reps.Job = "Plumber";
aa[0] = reps;
var o = new
{
sEcho = 1,
iTotalRecords = 1,
iTotalDisplayRecords = 1,
aaData = aa
};
res = Json(o);
return res;
}
[/code]
my jquery file is
[code]
var oTable;
$(document).ready(function() {
//event handlers
$("#uxAddReferral").click(OnAddReferralClick);
$('#demo').html('');
//setup the grid
oTable = $('#uxReferralTable').dataTable(
{
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "/Referral/Json"
}
);
});
[/code]
html file is (actually .spark)
[code]
[/code]
any ideas??
This discussion has been closed.
Replies
The thing that stands out immediately is that you are initialising DataTables on a non-table element (rather you are doing it on the div uxReferralTable). I'd suggest the first thing to try is to initialise it on the '#example' element that you are adding to the DOM.
Regards,
Allan
now it gives me "added data does not match known number of columns" and 'No matching records found"
the Json that is returned is below
[code]{"sEcho":1,"iTotalRecords":1,"iTotalDisplayRecords":1,"aaData":[{"Job":"Plumber","Name":"John"},{"Job":"Plumber2","Name":"John2"}]}[/code]
I've put it thru JsLint and it says good but the data does not show up
thanks for your help and sorry about the cross post
Kurt
mine is generated using the curly brackets [code]{}[/code] and your example uses the square brackets [code][][/code]
I think it is because I am using objects instead of array. I will try and see
[code]
$('#example').dataTable({
"aaData": [
/* Reduced data set */
["Trident", "Internet Explorer 4.0", "Win 95+", 4, "X"],
["Trident", "Internet Explorer 5.0", "Win 95+", 5, "C"],
["Trident", "Internet Explorer 5.5", "Win 95+", 5.5, "A"],
["Trident", "Internet Explorer 6.0", "Win 98+", 6, "A"],
["Trident", "Internet Explorer 7.0", "Win XP SP2+", 7, "A"],
["Gecko", "Firefox 1.5", "Win 98+ / OSX.2+", 1.8, "A"],
["Gecko", "Firefox 2", "Win 98+ / OSX.2+", 1.8, "A"],
["Gecko", "Firefox 3", "Win 2k+ / OSX.3+", 1.9, "A"],
["Webkit", "Safari 1.2", "OSX.3", 125.5, "A"],
["Webkit", "Safari 1.3", "OSX.3", 312.8, "A"],
["Webkit", "Safari 2.0", "OSX.4+", 419.3, "A"],
["Webkit", "Safari 3.0", "OSX.4+", 522.1, "A"]
],
[/code]
[code]
{"sEcho":1,"iTotalRecords":10,"iTotalDisplayRecords":10,"aaData":[[{"Job":"Plumber","Name":"John"}],[{"Job":"Plumber2","Name":"John2"}]]}
[/code]
EDIT: I'll produce a string that just returns the data not the columns and see how that goes
yet nothing is showing..
and if I remove the [code]
"aoColumns": [
{ "sTitle": "Job" },
{ "sTitle": "Name" }
]
[/code]
from the jquery then I get a 'length is null or not an object' on line 4645 [code] i=0, iLen=bUseCols ? oInit.aoColumns.length : nThs.length[/code] in the jquery.datatables.js file (v1.5.4)
I used the following code to return the right result..
hope this helps somebody
[code]
JsonResult res = null;
object[] aa = new object[2];
IList personList = new List();
personList.Add("developer");
personList.Add("kurt");
IList reps2List = new List();
reps2List.Add("plumber");
reps2List.Add("john");
aa[0] = personList;
aa[1] = reps2List;
var o = new
{
sEcho = 1,
iTotalRecords = 10,
iTotalDisplayRecords = 10,
aaData = aa
};
res = Json(o);
return res;
[/code]
naturally that code can be refactored but ok for example
Thanks again for your code. Probably worth noting that you only need to post your questions once, rather than in multiple different threads, as it can get quite difficult for me to keep a track of :-).
Regards,
Allan