jqgrid - 如何正确设置 jqGrid 的 jsonReader 来处理行的字符串数组

Question

这是我的专栏和模型项目:

var col_names = ['Qty', 'SFC', 'Item Nbr', 'Brand', 'Product', 'Supplier', 'Price', 'UOM', 'Case', 'Remarks', 'Weight', 'Par', 'Sort', 'Purchased', 'ProductId'];
var col_model = [
{ name: 'Quantity', index: 'Quantity', width: 22, sorttype: "number", editable: true, edittype: 'text', editoptions: { size: 10, maxlength: 15} },
{ name: 'ProductAttributes', index: 'ProductAttributes', width: 50 },
{ name: 'ItemNum', index: 'ItemNum', width: 50, align: "right"},
{ name: 'BrandName', index: 'BrandName', width: 100 },
{ name: 'ProducName', index: 'ProducName', width: 150 },
{ name: 'SupplierName', index: 'SupplierName', width: 100 },
{ name: 'Price', index: 'Price', width: 40, sorttype: "number", align: "right" },
{ name: 'UOM', index: 'UOM', width: 30 },
{ name: 'CasePack', index: 'CasePack', width: 30 },
{ name: 'PackageRemarks', index: 'PackageRemarks', width: 80 },
{ name: 'AveWeight', index: 'AveWeight', width: 33, align: "right" },
{ name: 'Par', index: 'Par', width: 20, align: "right", editable: true, edittype: 'text', editoptions: { size: 10, maxlength: 15} },
{ name: 'SortPriority', index: 'SortPriority', hidden: true },
{ name: 'LastPurchaseDate', index: 'LastPurchaseDate', width: 50, align: "right" },
{ name: 'ProductId', index: 'ProductId', hidden: true, key: true },
 ];

这是网格初始化

favoriteGrid = $('#favoriteGrid');

favoriteGrid.jqGrid({
    url: '/xxx/yyy/zzz/',
    datatype: 'json',
    ajaxGridOptions: { contentType: "application/json" },
    jsonReader: {
        id: "ProductId",
        cell: "",
        root: function (obj) { return obj.rows; },
        page: function () { return 1; },
        total: function () { return 1; },
        records: function (obj) { return obj.rows.length; },
        repeatitems: false
    },
    colNames: col_names,
    colModel: col_model,
    pager: $('#favoritePager'),
    pginput: false,
    rowNum: 1000,
    autowidth: true,
    sortable: true, // enable column sorting
    multiselect: true, // enable multiselct
    gridview: true,
    ignoreCase: true,
    loadonce: true, // one ajax call per 
    loadui: 'block',
    loadComplete: function () {         
        fixGridHeight(favoriteGrid);
    },
    ondblClickRow: function (rowid, ri, ci) {

    },
    onSelectRow: function (id) {
        if (id && id !== lastSel) {
            favoriteGrid.restoreRow(lastSel);
            lastSel = id;
        }
        favoriteGrid.editRow(id, true);
    },
    gridComplete: function () {

    }
}).jqGrid('navGrid', '#favoritePager',
    { add: false, edit: false, del: false, search: true, refresh: false },
    {},
    {},
    {},
    { multipleSearch: true, showQuery: false },
    {}).jqGrid('sortableRows').jqGrid('gridDnD');

最后是数据:

{"rows":[["1",null,"342240"," ","15 AMP, 600V, TIME DELAY, CLASS G","Home Depot - Canada","3.83","EA","1","- 15A, 600V - Class G - Mfg     #SC-15","0.02","","0",null,"2977175133"],["1",null,"3573375","NEWPRT","STEAK TOP SIRLOIN CH CC 8OZ","SYSCO","6.875","LB","24 PK","8 OZ","24 LB","","0",null,"1675949601"],["1",null,"201805"," ","GE-HOTPOINT DISHWASHER UPPER RACK","Home Depot - Canada","54.43","EA","1","Dishwasher Upper Rack - Fits Models #HDA2000, HDA2100 And GSD2100 - Mfg #WD28X10011","6.5","","0",null,"2977172115"],["1",null,"286044"," ","GE DISHWASHER SILVERWARE BASKET","Home Depot - Canada","19.19","EA","1","Silverware Basket - Mfg #WD28X265","0.06","","0",null,"2977172688"]]}

我得到了正确的行数和列数，但网格中没有显示任何数据，如果这有意义的话。

只是为了完整性:

        [HandleJsonException]
        public JsonResult ProductGroupService(Int64 id = 0)
        {
        var q = Repository.GetFavoriteProducts(SimpleSessionPersister.User.Id, id).ToArray();

        var result = (from fp in q
                      select new string[]
                                 {
                                     Convert.ToString(fp.Quantity),
                                     fp.ProductAttributes,
                                     fp.ItemNum,
                                     fp.BrandName,
                                     fp.ProducName,
                                     fp.SupplierName,
                                     Convert.ToString(fp.Price),
                                     fp.UOM,
                                     fp.CasePack,
                                     fp.PackageRemarks,
                                     fp.AveWeight,
                                     Convert.ToString(fp.Par),
                                     Convert.ToString(fp.SortPriority),
                                     fp.LastPurchaseDate,
                                     Convert.ToString(fp.ProductId)
                                 }).ToArray();


        var jsonData = new
        {
            rows = result
        };
        return Json(jsonData, JsonRequestBehavior.AllowGet);
    }

谢谢你， 斯蒂芬

Answer 1

您的主要问题是您使用了 jsonReader 的 repeatitems: false 属性，这对于您的输入来说是错误的。

此外，您应该删除 col_model 定义末尾的尾随逗号。许多现代浏览器会忽略该错误，但旧浏览器不会。

更改后网格将成功加载:参见the demo .