开发者问题收集

JQgrid Pivot:jquery.jqGrid.src.js:11851 未捕获的 TypeError:无法设置未定义的属性“grouping”

2017-11-24
555

我在将 JSON 数据绑定到 JQGrid Pivot 时遇到问题,第一次加载时会抛出以下错误并且无法加载 Jqgrid。第二次尝试时,不会出现以下错误并成功加载网格。

在此处输入图片描述

JQ 网格代码:

if ($("#rdbImperial").prop("checked")) {
    grid.jqGrid('jqPivot',
        gridData, {
            xDimension: [
            {
                dataName: 'MaterialID',
                label: 'MaterialID',
                width: 100
            },
            {
                dataName: 'ZDESMaterialID',
                label: 'ZDES Material ID',
                width: 150
            },

            {
                dataName: 'MaterialDescription',
                label: 'Material Description',
                width: 100
            }

            ],
            yDimension: [{
                dataName: 'DimensionCodeWithDescription',
                converter: MyConverter,

            }],
            aggregates: [
                {
                    formatoptions: { decimalPlaces: 4 },
                    label: "Imperial",
                    width: 160,
                    align: "right",
                    aggregator: "sum",
                    summaryType: "sum",
                    member: "ImperialWithoutUnit",
                    formatter: MyFormatterI,
                }
            ],
            //rowTotals: true,
            //colTotals: true,
            //frozenStaticCols: true
        },
        // grid options
        {
            viewrecords: true,
            gridview: true,
            loadOnce: true,
            emptyrecords: 'No record(s) to display',
            width: "100%",
            height: "Auto",
            multipleGroup:true,
            rowNum: 50,
            caption: "Grid View - Part Number(s) search result",
            loadComplete: function () {
                $('#gridPartNumberSearchGridView').css("max-width", "100%");
            },
            gridComplete: function () {
                if (window.IsMultiple == true) {
                    $('#divDisplayMessage').css("display", "block");
                }
                else {
                    $('#divDisplayMessage').css("display", "none");
                }
            }
        });

    $('#gridPartNumberSearchGridView').jqGrid('groupingRemove');
    $("#gridPartNumberSearchGridView").hideCol("MaterialID");
}

其中

var MyConverter = function (val) 
{ return (val.replace(/"/g, "")).replace(/'/g, "").replace(/\s/g, '_'); 
}

var MyFormatterI = function (cellvalue, options, rowObject) {
    //debugger;
    var storedString = localStorage.getItem('myEventsArray');
    var parsedObject = JSON.parse(storedString);
    if (options.rowId != "") {
        if (cellvalue === undefined) { return ''; }
        else if (cellvalue.toString().length > 10) { window.IsMultiple = true; return "*"; }
        else if (isNaN(cellvalue) && cellvalue != undefined && parsedObject!=null) {
            for (var i = 0; i < parsedObject.length ; i++) {
                if ((parsedObject[i].MaterialDescription == rowObject["MaterialDescription"])
                    && (parsedObject[i].ZDESMaterialID == rowObject["ZDESMaterialID"])
                    && ((parsedObject[i].DimensionCodeWithDescription.replace(/\s/g, '_') == options.colModel.name) || (parsedObject[i].DimensionCodeWithDescription.replace(/\s/g, '_') + '_sum_0' == options.colModel.name))
                    && (parsedObject[i].ImperialCount == 1)) {
                    var str = parsedObject[i].ImperialWithoutUnit;
                    return retValue(str);
                }
            }
        }
        else {
            return cellvalue;
        }
    }
}
3个回答

我认为错误的原因在于未创建数据透视表(因为 Ajax 和构建数据透视表的时间太短),但在创建之前调用了删除分组,这当然会失败。要纠正此问题,我建议您使用最后几个命令的 setTimeout - 即:

grid.jqGrid('jqPivot',
...
);  
setTimeout(function() {
    $('#gridPartNumberSearchGridView').jqGrid('groupingRemove');
    $("#gridPartNumberSearchGridView").hideCol("MaterialID");
}, 800);
Tony Tomov
2017-11-27

我们需要从 Pivot 中删除分组,因此我们使用 groupingRemove 方法。除了使用“MyFormatterI”将数字格式化为字符串外,还有其他方法可以获取文本吗? 是否可以直接通过 Pivot JQgrid 进行 ajax 调用(我试过,但没有成功),而不是从外部调用?

var MyConverter = function (val) 
{ return (val.replace(/"/g, "")).replace(/'/g, "").replace(/\s/g, '_'); 
}


var MyFormatterI = function (cellvalue, options, rowObject) {
    //debugger;
    var storedString = localStorage.getItem('myEventsArray');
    var parsedObject = JSON.parse(storedString);
    if (options.rowId != "") {
        if (cellvalue === undefined) { return ''; }
        else if (cellvalue.toString().length > 10) { window.IsMultiple = true; return "*"; }
        else if (isNaN(cellvalue) && cellvalue != undefined && parsedObject!=null) {
            for (var i = 0; i < parsedObject.length ; i++) {
                if ((parsedObject[i].MaterialDescription == rowObject["MaterialDescription"])
                    && (parsedObject[i].ZDESMaterialID == rowObject["ZDESMaterialID"])
                    && ((parsedObject[i].DimensionCodeWithDescription.replace(/\s/g, '_') == options.colModel.name) || (parsedObject[i].DimensionCodeWithDescription.replace(/\s/g, '_') + '_sum_0' == options.colModel.name))
                    && (parsedObject[i].ImperialCount == 1)) {
                    var str = parsedObject[i].ImperialWithoutUnit;
                    return retValue(str);
                }
            }
        }
        else {
            return cellvalue;
        }
    }
}

JSON 数据 (getData):

{ MaterialID = "000000000000000079", MaterialDescription = "38/NC;A", DimensionCodes = "AA3", DimensionDescription = "RACE", ImperialWithoutUnit = "1.58", MetricWithoutUnit = "9089", ZDESMaterialID = "000000000000000079", DimensionCodeWithDescription = "RACE" <br/> AA" }
{ MaterialID = "000000000000000079", MaterialDescription = "38/NC;A", DimensionCodes = "AA6", DimensionDescription = "LARGE", ImperialWithoutUnit = "2.93", MetricWithoutUnit = "9080", ZDESMaterialID = "000000000000000079", DimensionCodeWithDescription = "LARGE RIB<br/> AA" }
{ MaterialID = "000000000000000069", MaterialDescription = "38/NC;B", DimensionCodes = "AA7", DimensionDescription = "RACE BF", ImperialWithoutUnit = "3.775", MetricWithoutUnit = "19808", ZDESMaterialID = "000000000000000069", DimensionCodeWithDescription = "RACE BF<br/> AA" }
{ MaterialID = "000000000000000069", MaterialDescription = "38/NC;B", DimensionCodes = "AA9", DimensionDescription = "BORE", ImperialWithoutUnit = "4.1654", MetricWithoutUnit = "1980", ZDESMaterialID = "000000000000000069", DimensionCodeWithDescription = "BORE<br/> AA" }
{ MaterialID = "000000000000000059", MaterialDescription = "38/NC;C", DimensionCodes = "AA10", DimensionDescription = "SMALL RIB", ImperialWithoutUnit = "8.6250", MetricWithoutUnit = "1909", ZDESMaterialID = "000000000000000059", DimensionCodeWithDescription = "SMALL RIB<br/> AA" }
{ MaterialID = "000000000000000059", MaterialDescription = "38/NC;C", DimensionCodes = "AA11", DimensionDescription = "WIDTH", ImperialWithoutUnit = "10.8640", MetricWithoutUnit = "2290", ZDESMaterialID = "000000000000000059", DimensionCodeWithDescription = "WIDTH<br/> AA" }
{ MaterialID = "000000000000000049", MaterialDescription = "38/NC;D", DimensionCodes = "AA12", DimensionDescription = "LARGE WIDTH", ImperialWithoutUnit = "0.1600", MetricWithoutUnit = "9080", ZDESMaterialID = "000000000000000049", DimensionCodeWithDescription = "LARGE<br/> AA" }
{ MaterialID = "000000000000000049", MaterialDescription = "38/NC;D", DimensionCodes = "AA13", DimensionDescription = "LG HEIGHT", ImperialWithoutUnit = "0.1100", MetricWithoutUnit = "9080", ZDESMaterialID = "000000000000000049", DimensionCodeWithDescription = "LG<br/> AA" }
{ MaterialID = "000000000000000039", MaterialDescription = "38/NC;E", DimensionCodes = "AA14", DimensionDescription = "RACE FF", ImperialWithoutUnit = "0.1270", MetricWithoutUnit = "9097", ZDESMaterialID = "000000000000000039", DimensionCodeWithDescription = "RACE FF<br/> AA" }
{ MaterialID = "000000000000000039", MaterialDescription = "38/NC;E", DimensionCodes = "AA15", DimensionDescription = "LG RIB", ImperialWithoutUnit = "0.0500", MetricWithoutUnit = "8090", ZDESMaterialID = "000000000000000039", DimensionCodeWithDescription = "LG LENGTH<br/> AA" }
Jai Anand
2017-11-27

首先是一些常见的评论:jqGrid 4.6.0 已有 3.5 年的历史了!很久以来它都不再受支持。我另外写信给您说,只有发布 测试数据 和更完整的代码( MyFormatterIMyConvertergridData 未在您当前代码中定义)才能分析问题。我建议您升级到免费的 jqGrid 4.15.2。它包含 jqPivot 的完整重写实现,但大多数选项是相同的。请参阅 wiki 文章 中的更多详细信息。

关于您的主要问题。可以看出,错误存在于 groupingRemove 方法中。您的代码使用 grid.jqGrid('jqPivot', ...) 创建网格(数据透视表),但您稍后使用 $('#gridPartNumberSearchGridView') 而不是 grid (请参阅 groupingRemovehideCol 的调用)。我认为 $('#gridPartNumberSearchGridView') 不是 jqGrid,因此 groupingRemove 方法的调用失败。

更新: 如果您只想防止分组,您可以将 grouping: false 添加为 jqGrid 的附加参数(例如,在 rowNum: 50 附近)。

更新 2: Retro 版本 4.6 使用与免费 jqGrid 不同的参数顺序(比较 该行 这个 )。如果您不想升级到免费的 jqGrid,那么您可以使用 onInitGrid 作为解决方法:

onInitGrid: function () {
    this.p.grouping = false; // reset grouping before it will be processed
}
Oleg
2017-11-27