How to link jqGrid with asmx webservice c #

Please, I need help on how to link jqGrid with asmx webservice c #, I found several topics in how to convert asmx webservice to JSON, but it is not clear with me

Hello

+3


source to share


1 answer


First of all, you must define WebMethod

which will provide the data for the jqGrid. If you plan on doing server side sorting and paging, the web method must have at least the following parameters

public JqGridData TestMethod (int page, int rows, string sidx, string sord)

      

where the JqGridData

class will be defined like like

public class TableRow {
    public int id { get; set; }
    public List<string> cell { get; set; }
}
public class JqGridData {
    public int total { get; set; }
    public int page { get; set; }
    public int records { get; set; }
    public List<TableRow> rows { get; set; }
}

      

There are other options for how you can fill the grid, but it's important to understand at least one way first.

It is important that you do not need to manually convert the returned data to JSON to return JSON data from a web method . You just need to return an object with data, and the ASMX web service will serialize the XML or JSON object itself based on the HTTP request headers.



In the request to the server there will be application/json; charset=utf-8

or application/json

in part of the Content-Type

HTTP header, the data returned will be JSON and will be

{
    "d": {
        "page": 1,
        "total": 4,
        "records": 4,
        "rows": [
            ...
        ]
    }
}

      

On the client side, you should use

$("#list").jqGrid({
    url: 'MyTestWS.asmx/TestMethod',
    datatype: 'json',
    mtype: 'POST',
    ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
    serializeGridData: function (postData) {
        return JSON.stringify(postData);
    },
    jsonReader: {
        root: "d.rows",
        page: "d.page",
        total: "d.total",
        records: "d.records"
    }
    gridview: true,
    ...
}

      

See example here for example code.

UPDATED : You can download Visual Studio demo projects here and here . See the answer for more links to other demo projects.

+2


source







All Articles