2013-04-30 43 views
1

我有一個JQGrid treegrid,需要從ASP.NET MVC項目移到WebForms項目。將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數據和webservices在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); 
       }, 

WebService的骨架,需要返回JSON:

​​

編輯:

按照Olegs的建議,我編輯了我的webservice方法WS:

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

回答

2

我看到兩個明顯的錯誤:

  • 你應該定義一些類如TreeGrid描述你在WebMethod使用var jsonData對象。您應該刪除該對象的手動轉換爲字符串。而不是該網絡方法必須返回對象TreeGrid而不是string。您無法從ASMX Web服務和.NET框架返回原始數據。始終將對象轉換爲字符串。
  • .NET框架將網絡方法的完整響應放入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#代碼的示例。 }

+0

感謝Oleg,我已經應用並理解了您提出的更改......但仍然存在無法展開根節點的問題。請看我的編輯! – woggles 2013-04-30 07:32:25

+0

啊想出來了......對於ExpandColumn不會錯的!感謝您的幫助:) – woggles 2013-04-30 08:07:51

+0

@woggles:您現在在Web服務中使用的代碼應該和ASP.NET應用程序所做的一樣。 TreeGrid將樹參數發送到服務器'nodeid','parentid''n_level'(請參閱[文檔](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:adjacency_model#what_we_post))。服務器應該返回節點的子節點,這些節點的子節點將被消耗掉。你應該改變你的服務器代碼 – Oleg 2013-04-30 08:07:54