时间戳

首页 > 解决方案 > 使用 JqGrid 分组时数据无法正确显示

javascript - 使用 JqGrid 分组时数据无法正确显示

问题描述

我正在尝试使用 jqGrid 在组中显示数据。它为同名创建多个组。以下是我的代码

jQuery("#jqGridManage").jqGrid({
        datatype: "local",
        data: Projectdata,
        colNames: ['Action', 'Opportunity Id', 'Salesforce Opportunity ID', 'Project Name (Opportunity Name)', 'Project Type', 'Type Of Revenue', 'Milestone Description', 'Amount', 'PO Number', 'PO Amount', 'Close Date', 'Assigned To',
                    'Business Unit', 'Product', 'Channel Name', 'Sales Person', 'Vertical', 'Customer Name', 'Customer Contact','Region'],
        colModel: [
            { name: 'actionBtn', search: false, frozen: true, width: 200, align: 'center'},
            { name: 'OpportunityID', index: 'id', frozen: true },//, cellattr: arrtSetting
            { name: 'SalesforceOpportunityId', index: 'invdate', frozen: true },
            { name: 'OpportunityName', index: 'name', frozen: true },
            { name: 'ProjectTypeLongName', index: 'amount', frozen: true },
            { name: 'ProjectTypeChildName', index: 'tax', frozen: true },
            { name: 'ChannelName', index: 'total', frozen: true },
            { name: 'Amount', index: 'amount' },
            { name: 'PONumber', index: 'closedate' },
            { name: 'POAllocatedAmount', index: 'closedate' },
            { name: 'CloseDate', index: 'closedate' },
            { name: 'AssignedTo', index: 'note' },
            { name: 'BusinessUnit', index: 'note' },
            { name: 'Product', index: 'product' },
            { name: 'Channel Name', index: 'stage' },
            { name: 'SalesPerson', index: 'salesperson' },
            { name: 'Vertical', index: 'vertical' },
            { name: 'CustomerName', index: 'customername' },
            { name: 'CustomerContactNumber', index: 'currency' },
            { name: 'Region', index: 'amountexpected' }
        ],
        shrinkToFit: false,
        pager: "#jqGridPagerManage",
        viewrecords: true,
        autowidth: true,
        height: 450,
        sortname: "OpportunityID",
        grouping: true,
        groupingView: {
            groupField: ["OpportunityID"],
            groupColumnShow: [true, true],
            groupCollapse: false,
            groupDataSorted: true
        },
        resizeStop: function () {
            resizeColumnHeader.call(this);
            fixPositionsOfFrozenDivs.call(this);
            fixGboxHeight.call(this);
        },
        loadComplete: function () {
            fixPositionsOfFrozenDivs.call(this);
        },
        gridComplete: function () {
            var ids = $("#jqGridManage").jqGrid('getDataIDs');
            for (var i = 0; i < ids.length; i++) {
                var rowId = ids[i],
                //	statusId = $("#list").jqGrid ('getCell', rowId, 'statusId'),
                //	activeBtn = "";
                //	if (statusId == 0) { // Inactive
                        activeBtn = "<button class='ManageEditBtn ManageEdit'><i class='fa fa-edit'></i> Edit</button> <button class='ManageEdit ManageCreate'><i class='fa fa-plus'></i> Create Invoice</button>";
                //"onclick='publish(" + rowId + ")' />";
                //	}
                jQuery("#jqGridManage").jqGrid('setRowData', rowId, { actionBtn: activeBtn });


            }
        },
    })

在我来自后端的代码数据中。我按 OpportunityID 分组；有 4 个机会 ID，但每个组都显示多次。下面是我的截图供参考。 在此处输入图像描述

我也提到了其他相同的问题，但这没有帮助。有人可以帮我吗？

标签： javascriptjqueryjqgrid

解决方案

colModel，您使用的有许多不一致之处。您应该删除index属性。如果index与 结合使用datatype: "local"，则index属性的值应对应于该name属性或name另一列的引用colModel。最好的选择是根本不使用任何index属性。

此外，您必须修复Channel Name列的名称。property的值name将用于在 HTML 页面上构建一些内部元素的 id，HTML5 不允许在 id 中使用空格。

推荐阅读