json - 如何将 jqGrid 与 asmx webservice C# 绑定(bind)

Question

我需要一些关于如何将 jqGrid 与 asmx webservice C# 绑定(bind)的帮助，我发现了一些关于如何将 asmx webservice 转换为 JSON 的主题，但我不清楚

问候

Answer 1

首先，您应该定义 WebMethod，它将为 jqGrid 提供数据。如果你打算实现服务器端排序和分页，webmethod 应该至少有以下参数

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

JqGridData 类将被定义为例如

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; }
}

填充网格的方式还有其他不同的选择，但首先了解至少一种方式很重要。

重要的是，要从网络方法返回 JSON 数据，您不需要手动将返回的数据转换为 JSON。您只需返回包含数据的对象，ASMX Web 服务就会根据 HTTP 请求的 header 将对象本身序列化为 XML 或 JSON。

它对服务器的请求将有application/json; charset=utf-8 或 application/json 在 HTTP header 的 Content-Type 部分，返回的数据将是 JSON 并且将是

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

在客户端你应该使用

$("#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,
    ...
}

参见 here代码示例。

更新:Here和 here您可以下载 Visual Studio 演示项目。参见 the answer有关其他演示项目的更多链接。