Couple Questions - JSON and sAjaxSource
Couple Questions - JSON and sAjaxSource
Still working to integrate DataTables into my project (asp.net). I'm trying to use an asp.net webservice as the sAjaxSource and have confirmed that the JSON it outputs is correct using this jQuery call:
[code] $.ajax({
type: "POST",
url: "/Pages/Testing/testService.asmx/getGridJSON",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
$('#example').dataTable({
"aaData": eval(data.d)
});
}
});[/code]
However, the following dataTable call using sAjaxSource doesn't work (using breakpoints, the webservice is never hit):
[code]
$(document).ready(function() {
$('#example').dataTable( {
"sAjaxSource": '/Pages/Testing/testService.asmx/getGridJSON'
} );
} );
[/code]
What is the difference here? It would be great if I could reload the grid with the JSON using the first method (and keep sorting/etc.) as an alternative to getting sAjaxSource to work.
Any and all help is appreciated. I'd like to work datatables.net into an asp.net user control that can be used multiple times per page. Getting the reload (or load for that matter) to work is just a first step...
[code] $.ajax({
type: "POST",
url: "/Pages/Testing/testService.asmx/getGridJSON",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
$('#example').dataTable({
"aaData": eval(data.d)
});
}
});[/code]
However, the following dataTable call using sAjaxSource doesn't work (using breakpoints, the webservice is never hit):
[code]
$(document).ready(function() {
$('#example').dataTable( {
"sAjaxSource": '/Pages/Testing/testService.asmx/getGridJSON'
} );
} );
[/code]
What is the difference here? It would be great if I could reload the grid with the JSON using the first method (and keep sorting/etc.) as an alternative to getting sAjaxSource to work.
Any and all help is appreciated. I'd like to work datatables.net into an asp.net user control that can be used multiple times per page. Getting the reload (or load for that matter) to work is just a first step...
This discussion has been closed.
Replies
So...time to keep digging to see how hard it would be to change the $.getJSON to a $.ajax call for this project. Perhaps there is a way to reload from the JSON data as in example 1 above instead?
[code]
$.fn.dataTableExt.oApi.fnReloadJSON = function ( oSettings, json, fnCallback )
{
this.fnClearTable( this );
this.oApi._fnProcessingDisplay( oSettings, true );
var that = this;
/* Add the data to the table */
for ( var i=0 ; i
You are quite right, DataTables will use $.getJSON() which will send a GET request to the server. I might look at abstracting that out, rather like I have done for the server-side data get of data in a new release. The way I was expecting people to do a POST at initialisation time was to use $.ajax() themselves and then initialise DataTables using the aaData data source method, based on the return from the server.
Having said that, it doesn't look like you are actually sending any data to the server, so I'm not sure what different POST and GET will make. Surely ASP web-services don't require POST requests, even on empty data sets?
Regards,
Allan
How can I load the JSON data as jbad initially tried to do? I am calling a webservice that is returning JSON data. I would like to load the datatable with that data.
Thanks,
Jeff
Allan
I've added a property
[code]"contentType": "application/json; charset=utf-8",[/code]
in
[code]
this.fnServerData = function (url, data, callback) {
$.ajax({
"url": url,
"data": data,
"success": callback,
"dataType": "json",
"cache": false,
"error": function (xhr, error, thrown) {
if (error == "parsererror") {
alert("DataTables warning: JSON data from server could not be parsed. " +
"This is caused by a JSON formatting error.");
}
}
});
};
[/code]
so now it looks
[code]
this.fnServerData = function (url, data, callback) {
$.ajax({
"url": url,
"data": data,
"success": callback,
"contentType": "application/json; charset=utf-8",
"dataType": "json",
"cache": false,
"error": function (xhr, error, thrown) {
if (error == "parsererror") {
alert("DataTables warning: JSON data from server could not be parsed. " +
"This is caused by a JSON formatting error.");
}
}
});
};
[/code]
and after
[code]
/* if there is an ajax source load the data */
if (oSettings.sAjaxSource !== null && !oSettings.oFeatures.bServerSide) {
oSettings.fnServerData.call(oSettings.oInstance, oSettings.sAjaxSource, [], function (json) {
[/code]
I added:
[code]
if (json.hasOwnProperty("d"))
json = JSON.parse(json.d);
[/code]
Hope it helps,
Julius Bartkus
seems that in WCF services do not wrap the response into D.
But still in any case would be nice to have
[code]"contentType": "application/json; charset=utf-8",[/code]
by default, as DataTables always expect Json formated response.
What do you think?
/Julius Bartkus