jqGrid, datatype: function() and access to sord, sidx, etc.

Question

I'm attempting to implement the jqGrid using a WebMethod on the page that hosts the grid. This works if I using the dataType: function() in the jqGrid:

 $("#mygrid").jqGrid({
     ...
     datatype: function() {
          $.ajax({
              url: "myPage.aspx/gridData",
              type: "POST",
              contentType: "application/json; char=utf-8"
              ...
          });
     }
  )};

In my code behind of the same page, I have my method:

[WebMethod()]
public static List<MyData> gridData() {
    return MyClass.getData();
}

The only thing I'm not sure of is how I can get access to the data used for paging, sorting (sord, sidx, etc.)?

Thanks in advance.

Answer 1

I recommend you to use standard datatype: 'json' instead of datatype as function. You need only use additionally

datatype: 'json',
ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
mtype: 'GET',

(see http://stackoverflow.com/questions/2675625/setting-the-content-type-of-requests-performed-by-jquery-jqgrid/2678731#2678731 for example)

and return jqGridTable class instance defined like following

public class jqGridTable
{
    public int total { get; set; }      // total number of pages
    public int page { get; set; }       // current zero based page number
    public int records { get; set; }    // total number of records
    public List<jqGridRow> rows { get; set; }
}
public class jqGridRow
{
    public string id { get; set; }
    public List<string> cell { get; set; }
}

Or if we want use the most compact form of data transferred from server to client then following

// jsonReader: { repeatitems : true, cell:"", id: "0" }
public class jqGridTable {
    public int total { get; set; }          // total number of pages
    public int page { get; set; }           // current zero based page number
    public int records { get; set; }        // total number of records
    public List<List<string>> rows { get; set; }// first element of row must be id
}

Probably you should use a little other jsonReader to be able to decode data from the d property of the web service results (see http://stackoverflow.com/questions/3054463/jqgrid-3-7-does-not-show-rows-in-internet-explorer/3061669#3061669).

To support server side paging and sorting you should add

int page, int rows, string sidx, string sord

to the list of parameters of your service.

UPDATED: Other link http://stackoverflow.com/questions/3161302/jqgrid-page-1-of-x-pager/3161542#3161542 has practically full code of both jqGrid and the ASMX service. You can use the following simple jsonReader:

jsonReader: { root: "d.rows", page: "d.page", total: "d.total",
              records: "d.records", id: "d.names" }