为什么Jqgrid冻结列似乎不适用于过滤行和过滤器标题？

Question

我无法使用冻结列来使用jqgrid(4.3.0).我唯一能想到的是,我有一些不开箱即用的特定事物:

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

3. 我有以下代码用于显示jqggrid顶部的过滤器状态.(使用filtertoolbar)

   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);
   

任何人都可以想到任何可以阻止冻结柱在这些情况下工作的东西.

Answer 1

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

我在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"];

结果,我将在我的答案开头提到演示.如果要在搜索过滤器工具栏或高级搜索对话框中键入一些过滤器,网格的标题将会更改(如原始示例中所示),但所有冻结的潜水位置都将正确.