1

I'm trying to set up jqgrid with JSON data.
my problem is that the data returned from my service is in xml format.
I've tracked the request sent by the grid in firebug, and here's what it says:

Request Headers
Host    localhost
User-Agent  Mozilla/5.0 (Windows NT 5.1; rv:2.0.1) Gecko/20100101 Firefox/4.0.1
Accept  application/json, text/javascript, */*; q=0.01
Accept-Language en-gb,en;q=0.5
Accept-Encoding gzip, deflate
Accept-Charset  ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive  115
Connection  keep-alive
Content-Type    application/x-www-form-urlencoded; charset=UTF-8
X-Requested-With    XMLHttpRequest
Referer http://localhost/sample/sampleUserSearchPage.htm
Content-Length  60
Cookie  ASP.NET_SessionId=yfx42t45b0nidn45yztqzsun

notice the Content-Type field.
I've compared this to another jQuery.ajax request I was making, and I noticed that the only difference was in the Content-Type field. on the other request (which returned json), the Content-Type was application/json; charset=UTF-8;
i think that's the problem, but i couldn't find on the jqgrid docs how to change that.
attached is my jquery code:

$("#grid").jqGrid({
        url: 'SampleScriptService.asmx/GetGridData',
        datatype: "json",
        mtype: "POST",
        jsonReader : { root: "rows" },
        colNames: ['Username', 'Full Name', 'Monitor?', 'Schedule?', 'Reports?', 'Administrator?', 'Password'],
        colModel: [
            { name: 'username', key: true, index: 'id', jsonmap: 'Username' },
            { name: 'fullname', index: 'invdate', width: 90 , jsonmap: 'FullName' },
            { name: 'ismonitor', index: 'name', width: 100, jsonmap: 'IsMonitor' },
            { name: 'isschedule', index: 'amount', width: 80, jsonmap: 'IsSchedule' },
            { name: 'isreports', index: 'tax', width: 80, jsonmap: 'IsReports' },
            { name: 'isadministrator', index: 'total', width: 80, jsonmap: 'IsAdministrator' },
            { name: 'password', index: 'note', width: 150, jsonmap: 'Password' }
             ],
        rowNum: 10,
        viewrecords: true,
        caption: "Simple data manipulation",
    });

and the web service method:

[WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public GridData GetGridData(int page, int rows, /*string sixd,*/ string sord)
        {
            var arr= new UsersController().SearchUsers("", 10, 0).ToArray(); //this returns an array of User objects.
            GridData retVal = new GridData() { page = 1, records = 6, total = 34, rows = arr };

            return retVal;
        } 
J. Ed
  • 6,692
  • 4
  • 39
  • 55

1 Answers1

1

Probably the main problem which you have: you should add additional parameters to jqGrid:

ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
serializeGridData: function (postData) {return JSON.stringify(postData);}

Then the request from jqGrid will require JSON data. You can for example download the old demo project or read more information here.

Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • @Oleg- you're the best. I've been searching around SO for similar questions, and it seems like you're able to solve ALL of them. indeed my problem was that I didn't use the 'serializeGridData' function, and I got an error on the '_search' parameter. Thanks again! – J. Ed May 17 '11 at 13:41
  • @sJhonny: You are welcome! I recommend you to read [the answer](http://stackoverflow.com/questions/5500805/asp-net-mvc-2-0-implementation-of-searching-in-jqgrid/5501644#5501644) having [another demo](http://www.ok-soft-gmbh.com/jqGrid/jqGridDemo.zip). You can use the most of things not only in ASP.NET MVC, but in any ASP.NET environment. – Oleg May 17 '11 at 13:48