2

我正在尝试利用 jqgrid 的 jqpivot 的列标题组功能来拥有两个列标题(一个标题为星期几,另一个标题为实际日期)。

    var crewAttendance = { "total": 1, "page": 0, "records": 7,
            "rows": [
                { "ID": "1", "UserID": "10", "AttendanceTypeID": "6", "AttendanceDate": "04/05/15", "AttendanceDay": "SUN" },
                { "ID": "21", "UserID": "10", "AttendanceTypeID": "12", "AttendanceDate": "04/06/15", "AttendanceDay": "MON" },
                { "ID": "41", "UserID": "10", "AttendanceTypeID": "19", "AttendanceDate": "04/07/15", "AttendanceDay": "TUE" },
                { "ID": "61", "UserID": "10", "AttendanceTypeID": "17", "AttendanceDate": "04/08/15", "AttendanceDay": "WED" },
                { "ID": "81", "UserID": "10", "AttendanceTypeID": "17", "AttendanceDate": "04/09/15", "AttendanceDay": "THU" },
                { "ID": "101", "UserID": "10", "AttendanceTypeID": "19", "AttendanceDate": "04/10/15", "AttendanceDay": "FRI" },
                { "ID": "121", "UserID": "10", "AttendanceTypeID": "19", "AttendanceDate": "04/11/15", "AttendanceDay": "SAT" }
            ], "userID": ["10"], "firstName": ["Christopher"]
        }
        // create jqPivot Grid
    var grid = $("#pvtCrewAttendance");
    grid.jqGrid("jqPivot",
        crewAttendance.rows,
        {
            xDimension: [
                {
                    isGroupField: false,
                    width: 70,
                    dataName: 'UserID',
                    label: 'UserID'
                }
            ],
            yDimension: [
                {
                    dataName: 'AttendanceDay'
                },
                {
                    dataName: 'AttendanceDate'
                }
            ],
            aggregates: [
                {
                    aggregator: 'max',
                    width: 80,
                    member: 'AttendanceTypeID',
                    summarytype: 'count',
                    sortable: true,
                    resizable: false
                }
            ],
            groupSummary: false,
            colTotals: true
        },
    // grid options
        {
        height: 'auto',
        pager: '#nav',
        caption: 'Crew Attendance'
    });

    var cm = grid.getGridParam('colModel');
    for (var iCol = 0; iCol < cm.length; iCol++) {
        var cmi = cm[iCol];
        if (cmi.label.length == 3 || cmi.label.length == 0 || cmi.label == '\&nbsp\;') {
            grid.jqGrid('hideCol', cmi.name);
        }
    }
    grid.trigger('reloadGrid');

到目前为止,它适用于 SUN 和 MON,但由于某种原因,jqPivot 的列标题分组在剩下的日子里不能正常工作(TUE 和 WED 结合,然后 THU、FRI 和 SAT 也结合,但他们不应该因为他们在不同的日期)。在这里查看 jsFiddle

我怎样才能让它在剩下的日子里工作?

注意:我不能将两个标题组合在一起,因为我要将日期旋转 90 度。我已经完成了这部分,但在小提琴中将其删除以减少混乱。

4

1 回答 1

1

感谢您的错误报告!

经过长时间的调试,我发现并修复了这个错误。您的演示直接使用来自 GitHub 的最新资源。所以最后的更改也适用于演示。您可以验证它现在是否显示正确的结果。

更新:我在提交中实现了更多修复,并且在这个jsPivot 模块中实现了更多修复。应该修复来自 jqGrid 4.7 的旧错误。现在您的 JSFiddle 演示https://jsfiddle.net/OlegKi/4en1b68c/7/产生正确的结果(我在演示中进行了一些外观更改)。我希望代码也适用于更复杂的输入数据。此外,您可以通过隐藏具有cmi.label.length == 3 || cmi.label.length == 0 || cmi.label == '\&nbsp\;'. 我将列的存在解释为又一个错误,因此我修改了代码,使列不再存在于网格中。

于 2015-05-13T21:41:52.857 回答