Jqgrid not binding data

Question

I am getting Json response from WebService as below

Json returns data perfectly. Data looks like

{"d":"[{\\"ID\\":2,\\"Code\\":\\"mycode\\",\\"Name\\":\\"Myname\\",\\"PassWord\\":\\"A\\",\\"ClientLevel\\":0,\\"DeptNo\\":\\"\\",\\"DeptName\\":\\"\\"},{\\"ID\\":3,\\"Code\\":\\"mycode\\",\\"Name\\":\\"ｌｙ1\\",\\"PassWord\\":\\"mypassword\\", ....... but not binding my jqgrid.

and i have following Jqgrid Code

jQuery("#list2").jqGrid({
                mtype: 'POST',
                url: "myservice.asmx/GetQueryInfo",                  

                serializeGridData: function (postData) {
                    return JSON.stringify({
                        TableNames: TableName,
                        ColumnList: ColumnNames
                    });
                },

                ajaxGridOptions: { contentType: "application/json; charset=utf-8" },
               jsonReader: {
                        repeatitems: false,
                        root: 'd',                           
                        page: function (obj) { return 1; },
                        total: function (obj) { return 1; },
                        records: function (obj) { return obj.toString().length; }
                    },
                datatype: 'json',
                colNames: ['ID', 'Code', 'Name', 'PassWord', 'ClientLevel', 'DeptNo', 'DeptName'],
                colModel: [
                    { name: "ID", width: 55 },
                    { name: "Code", width: 90 },
                    { name: "Name", width: 100 },
                    { name: "PassWord",  width: 80 },
                    { name: "ClientLevel",  width: 80 },
                    { name: "DeptNo",  width: 80 },
                    { name: "DeptName",  width: 150 }
                ],
                autoencode: true,
                gridview: true,
                rowNum: 10,
                loadonce: true,
                rowList: [10, 20, 30],
                pager: '#pager2',
                sortname: 'ID',
                viewrecords: true,
                sortorder: "ID",
                caption: "JSON Example",
                loadError: function (jqXHR, textStatus, errorThrown) {
                    alert('HTTP status code: ' + jqXHR.status + '\n' +
                          'textStatus: ' + textStatus + '\n' +
                          'errorThrown: ' + errorThrown);
                    alert('HTTP message body (jqXHR.responseText): ' + '\n' + jqXHR.responseText);
                }
            });
            jQuery("#list2").jqGrid('navGrid', '#pager2', { edit: false, add: false, del: false });

Answer 1

I still think that you use old code on the server side ( WebMethod which returns string instead of object) because the value of d property is the string. You can use root in jsonReader as function defined like in the answer . In the case it will works in your case too. So you can use

jsonReader: {
    repeatitems: false,
    root: function (obj) {
        return typeof obj.d === "string" ? $.parseJSON(obj.d) : obj.d;
    }
}