在 MVC 中加载 jqGrid

Posted

技术标签:

【中文标题】在 MVC 中加载 jqGrid【英文标题】:jqGrid load in MVC 【发布时间】:2013-05-31 10:45:47 【问题描述】:

我是 jqgrid 的新手。我尝试在我的 mvc 项目中使用 jqgrid。我正在使用以下代码将数据映射到网格。但它不起作用。 GetJqGridData 函数首先加载到我的 MVC 项目中。

下面是控制器的代码。

public ActionResult GetJqGridData()
    
        var jqGridData = new JqGridObject()
        
            Data = GetSomeSampleData(),
            Page = "1",
            PageSize = 3, // u can change this !  
            SortColumn = "1",
            SortOrder = "asc"
        ;

        return Json(jqGridData, JsonRequestBehavior.AllowGet);
    

下面是 VIEW 的代码。

<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />  
<link href="../../Content/jquery.jqGrid/ui.jqgrid.css" rel="stylesheet" type="text/css" />  
<link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />

<script src="../../Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>  
<script src="../../Scripts/i18n/grid.locale-en.js" type="text/javascript"></script>  
<script src="../../Scripts/jquery.jqGrid.min.js" type="text/javascript"></script>  
<script type="text/javascript">
    $(document).ready(function () 
        $("#myGrid").jqGrid(
            url: '@Url.Action("GetJqGridData")',
            datatype: 'json',
            myType: 'POST',
            colNames: ['Id', 'Name'],
            colModel: [
 name: 'Id', index: 'Id' ,
 name: 'Name', index: 'Name' 
],
            jsonReader: 
                root: 'Data',
                id: 'id',
                repeatitems: false
            ,
            pager: $('#myPager'),
            rowNum: 5,
            rowList: [2, 5, 10],
            width: 600,
            viewrecords: true,
            caption: 'Jqgrid MVC Tutorial'
        );
    );  
</script>

<table id="myGrid"></table>  
<div id="myPager"></div>  

这是我得到的结果

谢谢 线轴

【问题讨论】:

【参考方案1】:

尝试使用以下 json 格式:

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

有关格式的更多信息,请查看此链接:http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data

【讨论】:

以上是关于在 MVC 中加载 jqGrid的主要内容,如果未能解决你的问题,请参考以下文章

在 mvc 中加载 2 个下拉列表的更好方法

无法在 MVC 项目中加载 CSS

如何使用 ViewData 在 MVC 中加载 HTML 表?

如何在类似 MVC 的页面中加载基于漂亮 URL 的类?

C#/IIS/MVC:静态内容未在不同环境中加载

捆绑包未在 ASP.NET MVC 4 中加载