Datatable 'loading' when calling data from asmx using ajax
Datatable 'loading' when calling data from asmx using ajax
I have an .asmx WebService that spits out valid JSON (using the serializer). Here's my code for two Datatables, the first Datatable works perfectly but as I understand it, using an Ajax success function to make the datatable is not the way to do things. So the second chunk of code is my attempt to get Datatables to make the ajax call, and the debugger shows the response coming back exactly the same as the first table, but no data gets rendered in the table - just "Loading".
$.ajax({
type: "POST",
url: "../../scripts/sqlservice.asmx/GetData",
contentType: "application/json; charset=utf-8",
success: function (data) {
$('#all_systems').dataTable({
data: JSON.parse(data.d),
columns: [
{ "data": "Netbios_Name0" },
{ "data": "Resource_Domain_OR_Workgr0" },
{ "data": "User_Name0" }
]
});
},
failure: function (data) {
alert(error);
}
});
$('#all_systems2').DataTable({
ajax: {
type: "POST",
url: "../../scripts/sqlservice.asmx/GetData",
contentType: "application/json; charset=utf-8",
success: function (data) {
alert(data.d); // EVERYTHING IS WORKING AT THIS POINT AND I HAVE A VALID JSON STRING RETURNED
data = JSON.parse(data.d); // SO I PARSE THE STRING AS I DO IN THE DATATABLE ABOVE
// AM I NOW MISSING SOMETHING HERE TO GET THE JSON PARSED DATA INTO THE DATATABLE?
},
failure: function (data) {
alert(error);
}
},
columns: [
{ "data": "Netbios_Name0" },
{ "data": "Resource_Domain_OR_Workgr0" },
{ "data": "User_Name0" }
]
});
At this point in time, I am not interested in ServerSide processing as the number of rows returned should be fine for client-side processing.
What am I missing?! Thanks!
This question has an accepted answers - jump to answer
Answers
Uhm... I see you're using the
ajax
as the same thing as$.ajax
from jQuery... Im pretty sure htats not right... Meaning I dont think theajax.contentType
,ajax.success
andajax.failure
would work properly...Does the console log show anything?..
I would think this should work.. But obviously I havent tested it in your network..
You dont need
contentType: "application/json; charset=utf-8"
, and you certainly don't need thesuccess
orfailure
(Which I thought it waserror
, notfailure
I notice you were parsing
data.d
in the first example, so sinced
is the object that holds the data (The default isdata
, we useajax.dataSrc
to specify that it isd
.So as long as the source of
ajax.url
looks something like this:You should be fine..
Thanks for your quick responses!
OK, so I think I've been here before... without the contentType option the asmx webservice returns as text/html which is no good to us and the Datatable errors stating invalid JSON and the debugger confirms the response body as wrapped up in xml.
So, I added the contentType option and now I get an error "Requested unknown parameter 'Netbios_Name0' for row 0. I end up with a table full of NULL.
"d" is something that apparently, so I have read, gets spat out instead of "data" by default when you use asmx/webservice as an AJAX source. The sqlservice.asmx I am using uses this function to spit out the data...
Here's what the code for the second table now looks like...
I used the debugger to look at the response body and it is laid out exactly as you have in your source example above, which is exactly the same response body received by my first functional Datatable code, which validates using JSONLint...
Like you say, it SHOULD work, the data format is good (as the previous datatable eats up the same response body)... and yet...
Thanks!
Ill write something up when i get home, but you can use the
xhr
to output some data for troubleshooting..Hurrah! With your help and some experimentation I figured it out! The last hurdle was that using my asmx web service we must always use JSON.parse on the returned data. After fishing around in the Datatables support I found this help page https://datatables.net/reference/option/ajax.dataSrc which mentioned how to use a function to manipulate the data returned from the server and that did the trick!
Here is my working second datatable code...
Many thanks for your help! I will sleep tonight!