2

我无法让冻结列与 jqgrid (4.3.0) 一起使用。我唯一能想到的是我有一些不是开箱即用的具体东西：

  1. 我在顶部使用过滤行。
  2. 我使用 (cloneToTop: true) 在网格顶部显示所有按钮

  3. 我有以下代码用于在 jqggrid 的顶部显示过滤器状态。（使用过滤器工具栏）

    loadComplete: function () {

    var postData = jQuery(gridSelector).getGridParam("postData");
    var newCapture = "";
    if (postData._search === true && typeof postData.filters !== "undefined") {
        var filters = jQuery.parseJSON(postData.filters);
        newCapture = "Filter: [";
        var rules = filters.rules;
        for (var i = 0; i < rules.length; i++) {
            var rule = rules[i];
            var op = rule.op;  // the code name of the operation
            if (jQuery.fn.searchFilter && jQuery.fn.searchFilter.defaults &&
            jQuery.fn.searchFilter.defaults.operators) {
                // find op description 
                var operators = jQuery.fn.searchFilter.defaults.operators;
                for (var j = 0; j < operators.length; j++) {
                    if (operators[j].op === rule.op) {
                        op = operators[j].text;
                        //op = $.jgrid.search.odata[j];
                        break;
                    }
                }
            }
            newCapture += rule.field + " " + op + " '" + rule.data + "'";
            if (i + 1 !== rules.length)
                newCapture += ", ";
        }
        newCapture += "]";
    }
    jQuery(gridSelector).setCaption(newCapture);

谁能想到任何可以阻止冻结列在这种情况下工作的方法。

4

1 回答 1

7

我分析了您的问题并创建了演示如何解决问题的演示。该演示使用冻结的第一列生成网格：

在此处输入图像描述

我在 jqGrid 中冻结列的当前（版本 4.3.1）实现中发现了一些错误，稍后将发布我的建议如何修复 trirand。问题如下：

可以清楚地看到第一个问题，尤其是datatype: 'local'在网格初始化期间将填充网格数据的位置。请参阅我刚刚调用该方法的相应演示setFrozenColumns。从图片上可以看出问题

在此处输入图像描述

On 可以看到只有列标题会被冻结，但是包含行号列的网格体会滚动。从下一个演示_complete中可以看出，在调用之后直接调用该方法setFrozenColumns来解决问题就足够了：

$grid.jqGrid('setFrozenColumns');
$grid[0].p._complete.call($grid[0]);

其中$grid定义为var $grid = $('#list');。

下一个问题是该方法仅使用标准网格标题（网格标题）的高度来_complete计算列标题的固定部分（保存在 中$grid[0].grid.fhDiv）和网格体的固定部分（保存在 中）的位置。$grid[0].grid.fbDiv因此，如果您使用setCaption更改标题，您可能会在错误的位置“冻结”潜水。_complete之后的方法调用setCaption将无法解决问题，并且仍然有演示中的结果：

在此处输入图像描述

为了解决这个问题，我编写了非常简单的函数fixPositionsOfFrozenDivs

var fixPositionsOfFrozenDivs = function () {
        if (typeof this.grid.fbDiv !== "undefined") {
            $(this.grid.fbDiv).css($(this.grid.bDiv).position());
        }
        if (typeof this.grid.fhDiv !== "undefined") {
            $(this.grid.fhDiv).css($(this.grid.hDiv).position());
        }
    };

它固定了冻结潜水的位置。

最后，我将实现更改loadComplete为以下内容：

loadComplete: function () {
    var $this = $(this), newCapture = "", filters, rules, rule, op, i, iOp,
        postData = $this.jqGrid("getGridParam", "postData"),
        isFiltering = $this.jqGrid("getGridParam", "search");

    if (isFiltering === true && typeof postData.filters !== "undefined") {
        filters = $.parseJSON(postData.filters);
        newCapture = "Filter: [";
        rules = filters.rules;
        for (i = 0; i < rules.length; i++) {
            rule = rules[i];
            op = rule.op;  // the code name of the operation
            iOp = $.inArray(op, arOps);
            if (iOp >= 0 && typeof $.jgrid.search.odata[iOp] !== "undefined") {
                op = $.jgrid.search.odata[iOp];
            }
            newCapture += rule.field + " " + op + " '" + rule.data + "'";
            if (i + 1 !== rules.length) {
                newCapture += ", ";
            }
        }
        newCapture += "]";
    }
    $this.jqGrid("setCaption", newCapture);
    fixPositionsOfFrozenDivs.call(this);
}

其中数组arOps定义为

var arOps = ["eq", "ne", "lt", "le", "gt", "ge", "bw", "bn", "in", "ni", "ew", "en",
             "cn", "nc"];

结果，人们将获得我在答案开头引用的演示。如果您在搜索过滤器工具栏或高级搜索对话框中键入一些过滤器，则网格的标题将被更改（就像在您的原始示例中一样），但所有冻结的潜水都将具有正确的位置。

于 2011-12-23T20:58:17.860 回答