使用ASP.NET的Jquery网格

Question

我试着在asp.net中使用Jquery grid，但是它不工作，它显示的网格内容为空，我不确定我的代码有什么问题！！下面是我的HTML代码：

<script type="text/javascript">
  $(function () {
      $("#list").jqGrid({
          url: '/WebServices/Admin/WebMethods.ashx',
          datatype: 'json',
          mtype: 'POST',
          colNames: ['ID', 'Name', 'Description'],
          colModel: [
                      { name: 'ID', index: 'ID', width: 55 },
                      { name: 'NAME', index: 'NAME', width: 90 },
                      { name: 'DESCRIPTION', index: 'DESCRIPTION', width: 80 }

                    ],
          jsonReader: {
              repeatitems:false
              },
          pager: $('#pager'),
          rowNum: 10,
          rowList: [10, 20, 30],
          sortname: 'ID',
          sortorder: 'desc',
          viewrecords: true,

          caption: 'Lockups'
      }).navGrid('#pager');
  });
</script>

然后是：

<form runat="server">
    <div style="width:700px">
        <table id="list" width="100%">
            <tr>
                <td />
            </tr>
        </table>
        <div id="pager">
        </div>
    </div>
</form>

我的C#代码，我将我的对象列表转换为JSON：

 public void ProcessRequest(HttpContext context)
 {

      context.Response.ContentType = "application/json"; 
      context.Response.Write(GetAllLookups());
 }

public string GetAllLookups()
{
    var lst = from lockup in LOCKUP_ITEMS.GetLockups()
              select new { 
                  ID = lockup.ID, 
                  NAME = lockup.NAME, 
                  DESCRIPTION = lockup.DESCRIPTION 
              };

    return Newtonsoft.Json.JsonConvert.SerializeObject(
        lst, 
        new JavaScriptDateTimeConverter());
}

Answer 1

jqGrid期望json数据采用某种格式：

{ 
  "total": "xxx", 
  "page": "yyy", 
  "records": "zzz",
  "rows" : [
    {"id" :"1", "cell" :["cell11", "cell12", "cell13"]},
    {"id" :"2", "cell":["cell21", "cell22", "cell23"]},
      ...
  ]
}

因此，将您的GetAlLookups方法更改为：

public string GetAllLookups()
{
    var list = LOCKUP_ITEMS.GetLockups();
    var numOfItems = list.Count();

    var result = new {
                    total = numOfItems ,
                    page = 1,
                    records = numOfItems ,
                    rows = (from lockup in list
                            select new {
                                ID = lockup.ID, 
                                NAME = lockup.NAME, 
                                DESCRIPTION = lockup.DESCRIPTION 
                            }).ToArray()
                };
    return Newtonsoft.Json.JsonConvert.SerializeObject(
        result, 
        new JavaScriptDateTimeConverter());
}  

Answer 2

尝试此mtype: 'POST'，而不是此mtype: 'POSTs'

编辑

嗨，试试下面的链接

How do I get jqGrid to work using ASP.NET + JSON on the backend?