【问题标题】:jqgrid undefined integer? pager not loadingjqgrid未定义的整数?寻呼机未加载
【发布时间】:2013-05-19 00:59:17
【问题描述】:

在 mvc4 上使用 jqgrids 的 IM,我需要获取一个简单的列表并使用 Ajax 显示它。

当我加载页面然后网格开始 Ajax 调用时,我在网格上只有 2 列,user_id 和 name。

加载 Json 时,我在 Google chrome 上收到下一个错误:

未捕获的 Typesetter:无法读取未定义的属性“整数”

在 Firefox 中,萤火虫:

TypeError:b.jgrid.formatter 未定义

关于 jquery.jqGrid.src.js:122

并且网格显示“未定义”消息,并且当前分页器控件未加载,但数据是

 <table id="GridUsuarios"></table>
    <div id="PagerUsuarios"></div>


  <script type="text/javascript"> 
        $(document).ready(function() {
            jQuery("#GridUsuarios").jqGrid({
                url: '@Url.Action("UsuariosGridData","Usuarios")',
                datatype: "json",
                myType: 'GET',
                contentType: "application/json; charset-utf-8",                
                colNames: ['Usuario', 'Nombre'],
                colModel: [
                    { name: 'user_id', index: 'user_id', width: 90},
                    { name: 'nombre', index: 'nombre', width: 200}
                ],
                pager: '#PagerUsuarios',
                rowNum: 10,
                rowList: [10, 20, 30],
                viewrecords: true,
                height: 'auto',
                sortname: 'nombre',
                sortorder: 'desc',
                caption: "Usuarios",
                jsonReader: {
                    root: "rows",
                    total: "total",
                    page: "page",
                    records: "records",
                    repeatitems: false,
                    id: "user_id"
                },
            });            
        });
    </script>

和我的控制器:

    public JsonResult UsuariosGridData(string sidx = "" , string sord = "", int page = 1, int rows = 10)
    {
        var resultado = db_hms.Users//.OrderByDescending(ur => ur.id_user)
                        .Join(db_hms.v_natural_person_short, ur => ur.id_employee, np => np.id_natural_person, (ur, np) => new { Users = ur, Natural_Person = np })//cambiar el idUser por idEmployee la relacion es alrevez XD                            
                        .Select(s => new { user_id = s.Users.id_user, nombre = s.Natural_Person.name_full })
                        .ToList();



        int vpage = page;
        int vrows = rows;  
        int counter = (int)Math.Ceiling((float)resultado.Count() / (float)vrows);            
        switch (sidx)
        {
            case "nombre":
                {
                            if(sord == "desc")
                            {
                                resultado = resultado.OrderByDescending(s => s.nombre).Skip(vrows * vpage).Take(vrows).ToList();
                            }
                            else
                            {
                                resultado = resultado.OrderBy(s => s.nombre).Skip(vrows * vpage).Take(vrows).ToList(); ;
                            }
                    break;
                }
            case "user_id":
                {
                            if(sord == "desc")
                            {
                                resultado = resultado.OrderByDescending(s => s.user_id).Skip(vrows * vpage).Take(vrows).ToList();
                            }
                            else
                            {
                                resultado = resultado.OrderByDescending(s => s.user_id).Skip(vrows * vpage).Take(vrows).ToList();
                            }
                    break;
                }
        }
        var retornar = new
        {
            total = counter,
            page = vpage,
            records = vrows,
            rows = resultado
        };

        return Json(retornar, JsonRequestBehavior.AllowGet);

    }

还有一个小 json 示例:

{"total":101,"page":1,"records":303,
 "rows":[{"user_id":"titito","nombre":"EL bonito, tito "},
        {"user_id":"noro","nombre":"ElMoro, Noro "},
        {"user_id":"maka","nombre":"Martinez, Macanencio "}]}

【问题讨论】:

    标签: json jqgrid pagination


    【解决方案1】:

    如果没有包含所需的语言文件grid.locale-XX.js(例如grid.locale-en.js),通常会收到错误消息之前 jquery.jqGrid.min.jsjquery.jqGrid.src.js。参见the documentation中jqGrid的使用示例。

    另外我建议你在jqGrid中添加gridview: trueautoencode: true选项,删除不存在的myType: 'GET'(有mtype选项默认值如果"GET"),减少jsonReader到@ 987654332@,从colModel 中删除所有index 属性(因为您使用的值与name 属性的值相同)并将key: true 添加到'user_id' 列的定义中。

    因为您没有实现数据的服务器端分页,我建议您另外添加loadonce: true 选项。它允许您从UsuariosGridData 一次返回所有数据,jqGrid 将实现客户端排序、分页或可选的数据过滤/搜索。

    【讨论】:

    • 不能让它工作,这是我的 BundleConfig:bundles.Add(new ScriptBundle("~/bundles/jqgrid").Include("~/Scripts/jquery.jqGrid.js", " ~/Scripts/i18n/grid.locate-es.js", "~/Scripts/jquery.jqGrid.src.js")); bundles.Add(new StyleBundle("~/Content/jquery.jqgrid/jqgridui").Include("~/Content/jquery.jqGrid/ui.jqgrid.css"));
    • 和布局上 @Scripts.Render("~/bundles/modernizr") @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryui" ) @Scripts.Render("~/bundles/jqgrid") @RenderSection("scripts", required: false)
    • @EricGS:不客气!如果包含"~/Scripts/jquery.jqGrid.src.js""~/Scripts/jquery.jqGrid.min.js",则不需要包含"~/Scripts/jquery.jqGrid.js"。所以一个应该只包括"~/Scripts/i18n/grid.locate-es.js",然后例如"~/Scripts/jquery.jqGrid.src.js"
    • 非常感谢!走出地狱!
    • 奥列格再次来救我们!
    【解决方案2】:

    首先添加对 jqgrid locale 文件的引用,然后是 jqrid

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/i18n/grid.locale-en.js"></script>
    <script src="https://cdn.jsdelivr.net/jqgrid/4.6.0/jquery.jqGrid.min.js"></script>
    

    【讨论】:

      猜你喜欢
      • 2014-12-30
      • 1970-01-01
      • 2012-08-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-08-10
      相关资源
      最近更新 更多