JQGrid分组GroupText格式化和修改

标签 jqgrid jqgrid-asp.net jqgrid-php jqgrid-formatter

我有一个实现分组的网格,但想扩展 groupText: 区域中显示的详细信息。理想情况下,我能够获取有关该分组的数据,并使用组名称({0} 默认值)显示在该组行中。

换句话说,我想要实现的是一种不仅显示组名称,还显示 JSON 提要中包含的其他一些数据项到网格的方法。

我的搜索似乎没有任何人能够实现这一目标,但我希望有人能够阐明如何扩展此设置并提供格式化此区域的访问权限。

最佳答案

我觉得你的问题很有趣,但是实现起来并不简单。在 the answer我之前展示了如何在分组的摘要行中使用自定义格式化程序。

the demo您可以看到如何实现分组文本的自定义格式。该演示显示以下内容:

enter image description here

该实现仅由 the custom formatter 的实现组成它可用于两个目的:格式化相应列的内容以及格式化分组文本(如果按列分组)。代码有点棘手,但我希望所有人都能遵循它。代码利用输入参数的差异来定义是否调用格式化程序来格式化列内容或格式化分组文本。

获取“(test4,test7)”等文本的代码的一部分在使用大量行的情况下不太有效,但它可以工作。

下面是“日期”列的格式化程序代码,通常与预定义的格式化程序:'date'一起使用。我在代码部分中调用了原始的日期格式化程序,但用于分组文本的更复杂的代码:

formatter: function (cellval, opts, rowObject, action) {
    var fullOpts = $.extend({}, $.jgrid.formatter.date, opts),
        formattedDate = $.fmatter.util.DateFormat('Y-m-d', cellval, 'd-M-Y', fullOpts),
        groupIdPrefix = opts.gid + "ghead_",
        groupIdPrefixLength = groupIdPrefix.length,
        month = Number(cellval.split('-')[1]), // input format 'Y-m-d'
        names = [], data, i, l, item;

    // test wether opts.rowId start with opts.gid + "ghead_" and integer
    // and rowObject is the array and action is undefined.

    if (opts.rowId.substr(0, groupIdPrefixLength) === groupIdPrefix && typeof action === "undefined") {
        // custom formating of the group header
        // we just simulate some login by testing of the month > 9

        // the next code fragment is not effective, but it can be used
        // in case of not so large number of groups and the local data
        data = $(this).jqGrid("getGridParam", "data");
        for (i = 0, l = data.length; i < l; i++) {
            item = data[i];
            if (item.invdate === cellval) {
                names.push(item.name);
            }
        }

        return (month > 9 ? ('<span class="ui-icon ui-icon-alert" style="float: left;"></span>' +
            '<span style="color:tomato; margin-left: 5px;">') : "<span>") +
            formattedDate + ' (' + names.join() + ')</span>'
    }
    return formattedDate;
}

更新:演示的修复版本是 here 。它使用 $.fn.fmatter 而不是当前从 jqGrid 方法 $.fmatter.util.DateFormat 中删除的。

关于JQGrid分组GroupText格式化和修改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10803081/

相关文章:

jquery - JQgrid水平滚动条不显示

php - jQGrid 与 Oracle 数据库

javascript - jqgrid设置一行的背景

jquery - 如何在 jqgrid 标题组中居中对齐文本

javascript - 从哪里下载 ui.jqgrid-bootstrap.css?

c# - 服务器端分页和排序最佳实践?

jquery - 将 jqGrid 绑定(bind)到 JSON 对象

jquery - 重新加载 JQGrid 编辑表单

jquery - Jqgrid表格编辑出错