jqGrid JSON映射不读取INDEX值

Question

我试图显示一个jqGrid使用jquery 1.6.2.mins，和最新的jqGrid - jqGrid 4.5.4。

我的项目设置为： ASP.NET - 使用MVC2 Visual Studio 2010中 框架是.NET 4.0

问题：在我的C＃类我从我将数据库中添加的所有行在一个点或另一个使用。我只想在最初显示两行（NAME,DESCRIPTION）。

jqGrid显示两行，但它显示我的id行在第一个应该显示什么说明列显示。所以基本上发生了什么事情，行正在向右移动，而我的列映射不起作用。 NAME = 'NAME_TXT'，但由于某种原因，我在显示屏上获得的是NAME = ID;

colNames: ['NAME', 'DESCRIPTION'], 
colModel: [ 
    { name: 'NAME', index: 'NAME_TXT', align: 'left' }, 
    { name: 'DESCRIPTION', index: 'DESCRIPTION_TXT', align: 'left'} 
], 

我也想知道我怎么能显示JSON数据正从C＃代码回来了，我怎么在console.log("JSON DATATYPE: " + $datatype)显示对象，类似的东西应有尽有。

谢谢。

JavaScript代码：

$(function() { 
    $grid = $("#grid"); 

    $grid.jqGrid({ 
     type: 'GET', 
     contentType: "application/json; charset=utf-8", 
     url: '/csc/devapp1/Home/LinqGridData/', 
     datatype: 'json', 
     colNames: ['NAME', 'DESCRIPTION'], 
     colModel: [ 
      { name: 'NAME', index: 'NAME_TXT', align: 'left' }, 
      { name: 'DESCRIPTION', index: 'DESCRIPTION_TXT', align: 'left'}],  
     sortname: 'NAME_TXT', 
     sortorder: "desc", 
     repeatitems: false, 
     viewrecords: true, 
     height: '500px', 
     autowidth: true}); 
}); 

C＃代码：

我以前试过

public ActionResult LinqGridData(string sidx, string sord, int page, int rows) 
{ 
    var context = new CSCEntities(); 

    var jsonData = new 
    { 
     total = 1, 
     page = page, 
     records = context.tbl_Quickfix_Toolbar.Count(), 
     rows = context.tbl_Quickfix_Toolbar.AsEnumerable().Select(n => 
      new { n.QUICKFIX_ID, 
       cell = new string[] { 
        n.QUICKFIX_ID.ToString(), 
        n.NAME_TXT.ToString(), 
        n.DESCRIPTION_TXT.ToString(), 
        n.INSTRUCTIONS_TXT.ToString(), 
        n.TYPE_TXT.ToString(), 
        n.FIXLINK_TXT.ToString()} 
      }).ToArray() 
    }; 
    return Json(jsonData, JsonRequestBehavior.AllowGet); 
} 

其他C＃代码，没有工作：

public ActionResult GridData(string sidx, string sord, int page, int rows) 
    { 
     CSCEntities entities = new CSCEntities(); 
     int pageIndex = Convert.ToInt32(page) - 1; 
     int pageSize = rows; 
     int totalRecords = entities.tbl_Quickfix_Toolbar.Count(); 
     int totalPages = (int)Math.Ceiling((float)totalRecords/(float)pageSize); 

     var jsonData = new { 
      total = totalPages, 
      page = page, 
      records = totalRecords, 

      rows = (
       from entity in entities.tbl_Quickfix_Toolbar 

       select new { 
        id = entity.QUICKFIX_ID, 
        cell = new string[] { 

         entity.NAME_TXT.ToString(), 
         entity.DESCRIPTION_TXT.ToString(), 
         entity.QUICKFIX_ID.ToString(), 
         entity.INSTRUCTIONS_TXT.ToString() } 
        }).ToArray() 
     }; 
     return Json(jsonData, JsonRequestBehavior.AllowGet); 
    } 

Answer 1

您发布的代码在客户端和服务器端都有很多问题。我只会提到一些问题。

您的主要问题是您使用的服务器代码。目前在服务器代码

... 
new { n.QUICKFIX_ID, 
    cell = new string[] { 
     n.QUICKFIX_ID.ToString(), 
     n.NAME_TXT.ToString(), 
     n.DESCRIPTION_TXT.ToString(), 
     n.INSTRUCTIONS_TXT.ToString(), 
     n.TYPE_TXT.ToString(), 
     n.FIXLINK_TXT.ToString()} 
} 
... 

这似乎应该改为

... 
new { 
    id = n.QUICKFIX_ID, 
    cell = new [] { 
     n.NAME_TXT.ToString(), 
     n.DESCRIPTION_TXT.ToString() 
    } 
} 
... 

你用，你应该额外考虑删除.AsEnumerable()或应用select后，将其移动。

首先index属性在服务器端排序只有一些含义。您发布的服务器代码不使用sidx和sord参数。所以你应该删除所有index属性从colModel。如果没有指定index属性，则jqGrid使用与index相同的值作为值name属性。这是99％的情况下需要的。所以我建议你不要指定index属性。因为您使用的是项目的数组格式（cell = new string[] {...},name属性的选择是免费的，您可以像name: 'NAME'一样使用name: 'NAME_TXT'如果数据库中的列名称为NAME_TXT和DESCRIPTION_TXT我个人更喜欢使用相同的值name。

默认值align财产已经'left'。所以最好从colModel中删除不需要的align: 'left'财产。 '500px'对于height选项的值是错误的。正确的值是字符串"auto"或字符串"100%"或任何整数值如height: 500。我个人喜欢使用height: "auto"。

jqGrid没有contentType选项。如果您需要指定HTTP请求的contentType，则应改为使用{ajaxGridOptions: { contentType: "application/json; charset=utf-8" }。选项repeatitems不存在，应将其删除。另一方面，我建议您在jqGrid中添加两个其他选项：gridview: true和autoencode: true。

另一个非常重要的选项是rowNum。它的默认值是20。该值将作为rows参数的值发送到服务器（请参阅LinqGridData的参数）。服务器应该只返回sidx排序的rows项数据。如果服务器返回更多为rows项目（多于20项），则jqGrid仍然只会显示第一个rows项目（仅前20项）。通常，网格在网格的底部或顶部具有寻呼机栏。所以用户可以转到另一个页面。您目前不使用page和toppager选项。结果网格将包含多达20行，并且用户将不可能使用分页查看其余数据。 我建议您使用pager或toppager: true选项，或者至少应该包含rowNum: 10000选项，以显示从服务器返回的最多10000行。

如果不实施服务器端分页，排序和过滤数据可以返回所有数据的jqGrid，但使用的jqGrid的loadonce: true选项。在所有数据将被本地保存的情况下，datatype将在从服务器第一次加载后变为"local"，并且用户将能够在本地对数据进行排序或使用分页而不需要您编写任何附加代码。如果您需要显示的数据（tbl_Quickfix_Toolbar）不是太大，这是非常实用的选项。