将 jqGrid 从 ASP.NET MVC 移动到 WebForms 项目时所需的更改

Question

我有一个 JQGrid 树网格，我需要将它从 ASP.NET MVC 项目转移到 WebForms 项目。

我决定在项目中使用 web 服务来返回网格的数据，因为我没有太多编写自定义处理程序的经验。

这是我现有的网格：

$("#TreeGrid").jqGrid({
                 url: '@Url.Action("GetSPTreeJSON", "Index")',
                 treeGrid: true,
                 datatype: "json",
                 mtype: "POST",
                 treeGridModel: 'adjacency',
                 postData: { currentUserGroup: currentUserGroup },
                 colNames: ["id", "partners"],
                 colModel: [
                        { name: 'id', index: 'id', hidden: true, key: true },
                        { name: 'partners', index: 'name', width: 500, sortable: false, classes: 'pointer' }
                ],                   
                 ExpandColumn: 'partners',                  
                 gridview: true
             });

以及现有的控制器动作：

    public JsonResult GetSPTreeJSON(string nodeid, string n_level, Guid currentUserGroup)
    {
        List<TreeNode> list = clientService.GetTreeNodeList(nodeid, n_level, currentUserGroup);

        var jsonData = new
        {
            page = 1,
            total = 1,
            records = 1,
            rows = (
                from TreeNode u in list
                select new
                {
                    cell = new object[] { u.Id.ToString(), u.name, u.level, u.ParentId, u.isLeaf, false }
                }).ToList()
        };

        return Json(jsonData, JsonRequestBehavior.AllowGet);
    }

Json 示例（用于根节点）：

{
   "page":1,
   "total":1,
   "records":1,
   "rows":[
      {
         "cell":[
            "5a1a9742-300f-11d3-941f-036008032006",
            "root node",
            0,
            null,
            false,
            false
         ]
      }
   ]
}

我的问题是：要让它在使用 json 数据和 web 服务的 asp.net webforms 项目中工作，究竟需要什么？

到目前为止我的工作是什么：

添加或更改了以下 jqGrid 选项：

url: 'JQGridData.asmx/GetSPTreeJSON', //now points to the webservice
ajaxGridOptions: { contentType: 'application/json; charset=utf-8' }, //looks like it wont hit the webservice if this isn't included
serializeGridData: function (postData) { //looks like this is required because the webservice call will fail if not passed the correct parameters
                    if (postData.nodeid === undefined) postData.nodeid = null;
                    if (postData.n_level === undefined) postData.n_level = null;                 
                    return JSON.stringify(postData);
                },

需要返回JSON的WebService骨架：

 [WebMethod, ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public string GetSPTreeJSON(string nodeid, string n_level, Guid currentUser)
        {

              List<TreeNode> list = clientService.GetTreeNodeList(nodeid, n_level, currentUserGroup);

            var jsonData = new
            {
                page = 1,
                total = 1,
                records = 1,
                rows = (
                    from TreeNode u in list
                    select new
                    {
                        cell = new object[] { u.Id.ToString(), u.name, u.level, u.ParentId, u.isLeaf, false }
                    }).ToList()
            };

JObject json = JObject.Parse(jsonData);
return = json.ToString();           
        }

编辑：

按照 Olegs 的建议，我编辑了我的 webservice 方法如下：

 public class jqGridRecord
    {
        public Guid Id { get; set; }           
        public string Name { get; set; }
        public int level { get; set; }
        public Guid? parent { get; set; }
        public bool isLeaf { get; set; }
        public bool expanded { get; set; }
    }

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[System.Web.Script.Services.ScriptService]
public class JQGridData : System.Web.Services.WebService
{
    private readonly ClientService clientService = new ClientService();      


    [WebMethod, ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public JqGridData GetSPTreeJSON(string nodeid, string n_level, Guid currentUser)
    {
        List<TreeNode> list = clientService.GetTreeNodeList(nodeid, n_level, currentUser);

        List<jqGridRecord> data = new List<jqGridRecord>();

        foreach (var i in list)
        {
            jqGridRecord r = new jqGridRecord
            {
                Id = i.Id,
                Name = i.name, 
                level = i.level,
                parent = i.ParentId,
                isLeaf = i.isLeaf,                   
                expanded = false
            };

            data.Add(r);
        }

        int recordsCount = data.Count;                      

        return new JqGridData()
        {
            total = 1,
            page = 1,
            records = recordsCount,
            rows = data
        };
    }
}

public class JqGridData
{
    public int total { get; set; }
    public int page { get; set; }
    public int records { get; set; }
    public List<jqGridRecord> rows { get; set; }
}

并将以下内容添加到 jqGrid 选项中：

 colModel: [
                        { name: 'Id', hidden: true, key: true },
                        { name: 'Name', width: 500, sortable: false, classes: 'pointer' }
                ],
jsonReader: { repeatitems: false, root: "d.rows", page: "d.page", total: "d.total", records: "d.records" },

现在为根返回了以下JSON，我可以在树中看到根节点但无法单击+图标来展开它……看来jsonReader还是有问题？

{
   "d":{
      "__type":"SSDS.iValue.JqGridData",
      "total":1,
      "page":1,
      "records":1,
      "rows":[
         {
            "Id":"5a1a9742-3e0f-11d3-941f-006008032006",
            "Name":"acsis Limited",
            "level":0,
            "parent":null,
            "isLeaf":false,
            "expanded":false
         }
      ]
   }
}

Answer 1

我看到两个明显的错误：

• 您应该定义一些类，例如TreeGrid，它描述了您在WebMethod 中使用的var jsonData 对象。您应该删除对象到字符串的手动转换。而不是那个 web 方法必须返回 object TreeGrid 而不是 string。您不能从 ASMX Web 服务返回原始数据，并且 .NET 框架总是将对象转换为字符串。
• .NET 框架将 web 方法的完整响应放在d prpterty 中。所以响应将是

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

所以你应该将选项jsonReader 添加到jqGrid：

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

顺便说一句，如果您决定使用 ASHX 句柄而不是 ASMX Web 服务，您可以提高应用程序的一些性能。您可以在the answer 中找到并下载相应的 C# 代码示例。 }