Can you use jqGrid within ASP.net using a webservice and javascript? - asp.net

Question

The jqGrid has been kicking my butt (as well as others on this site). I can't seem to get the JSON data from the webservice to load into the jqGrid when using the addJSONData method.
Does anyone know if this is possible to do? I am not using MVC just a plain WebProject webservice in ASP.NET 3.5.
I am using the latest version of jqGrid 3.5.
I don't know what to do. I am currently trying to load just 1 row that I am returning a string in my WS like this:
"Page:1,Total:1,Records:1,Rows:[name: Jeff V title: Programmer]"
Which is then passed into my javascript as:
{"d":"Page:1,Total:1,Records:1,Rows:[name: Jeff Vaccaro title: Programmer]"}
My jQuery code is the following:
jQuery(document).ready(function () {
jQuery("#list").jqGrid({
datatype: processrequest,
mtype: 'POST',
colNames: ['Name', 'Title'],
colModel: [
{ name: 'name', index: 'name', width: 55 },
{ name: 'title', index: 'title', width: 90 }
],
pager: jQuery('#pager'),
rowNum: 10,
rowList: [10, 20, 30],
sortname: 'id',
sortorder: "desc",
viewrecords: true,
imgpath: 'themes/basic/images',
caption: 'My first grid'
});
});
function processrequest(postdata) {
$(".loading").show();
$.ajax({
type: "POST",
data: "{}",
datatype: "clientside",
url: "../webServices/myTestWS.asmx/testMethod",
contentType: "application/json; charset-utf-8",
complete: function (jsondata, stat) {
if (stat == "success") {
jQuery("#list")[0].addJSONData(eval("(" + jsondata.responseText + ")"));
$(".loading").hide();
} else {
$(".loading").hide();
alert("Error with AJAX callback");
}
}
});
}
I've tried all sorts of different variations of the addJSONData code. Does anyone know if this is possible to do?
Any help is appreciated!
Thanks

Answer 1

First of all your web service should return a class instance with properties page, total, records, rows and so on. If web method has attribute [ScriptMethod (ResponseFormat = ResponseFormat.Json)] the class instance will be correct converted to the the JSON data.
You can use ajaxGridOptions: { contentType: 'application/json; charset=utf-8' } parameter and jsonReader (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data#json_data) to load data in the jqGrid. Information from Jqgrid 3.7 does not show rows in internet explorer and Best way to change jqGrid rowNum from ALL to -1 before pass to a web service could be helpful for you.
At the end imgpath is no more supported in version 3.5 of jqGrid.