为什么 Jqgrid 冻结列似乎不适用于过滤器行和过滤器标题? [英] why doesn't Jqgrid frozen column seem to work with filter rows and filter heading?
问题描述
我无法让冻结列与 jqgrid (4.3.0) 一起使用.我唯一能想到的是我有一些不是开箱即用的具体东西:
- 我在顶部使用过滤行.
- 我使用 (cloneToTop: true) 在网格顶部显示所有按钮
我有以下代码用于在 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 = "过滤器:[";var rules = filters.rules;for (var i = 0; i < rules.length; i++) {var 规则 = 规则 [i];var op = rule.op;//操作的代号if (jQuery.fn.searchFilter && jQuery.fn.searchFilter.defaults &&jQuery.fn.searchFilter.defaults.operators) {//查找操作描述var 运算符 = jQuery.fn.searchFilter.defaults.operators;for (var j = 0; j
谁能想到在这种情况下会阻止冻结列工作的任何事情.
我分析了你的问题并创建了 ，其中我刚刚调用了方法 setFrozenColumns.看图就知道问题了
可以看到只有列标题会被冻结，但是包含行号列的网格体会滚动.如何从 我回答的开始.如果您在搜索过滤器工具栏或高级搜索对话框中键入一些过滤器，则网格的标题将被更改(就像在您的原始示例中一样)，但所有冻结的潜水都将具有正确的位置.
i can't get frozen columns to work with jqgrid (4.3.0). the only thing i can think of is that i have some specific things that are not out of the box:
- I am using filtered row at the top.
- I am showing all buttons at the top of the grid using (cloneToTop: true)
I have the following code that i use to show filter status at the top of jqggrid. (using 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);
can anyone think of anything that would prevent frozen columns from working under these circumstances.
I analysed your problem and created the demo which demonstrate how the problem can be solved. The demo produces the grid with the frozen first column:
I found some bugs in the current (version 4.3.1) implementation of frozen columns in jqGrid and will post later my suggestions how to fix there to trirand. The problems are the following:
One can sees the first problem especially clear in case of datatype: 'local' where the data of the grid will be filled during the grid initialization. See the corresponding demo in which I just called the method setFrozenColumns. One can see the problem on the picture
On can see that only the column header will be frozen, but the grid body inclusive the column with row numbers will be scrolled. How one can see from the next demo it will be enough to call the method _complete directly after calling of setFrozenColumns to fix the problem:
$grid.jqGrid('setFrozenColumns');
$grid[0].p._complete.call($grid[0]);
where $grid is defined as var $grid = $('#list');.
The next problem is that _complete method calculate the position of the fixed part of the column header (saved in $grid[0].grid.fhDiv) and the fixed part of the grid body (saved in $grid[0].grid.fbDiv) only using the height of the standard grid's caption (grid title). So if your use setCaption to change the caption you can have "frozen" dives in the wrong position. The call of _complete method after the setCaption will not fix the problem and one still have the results like on the demo:
To fix the problem I wrote very simple function 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());
}
};
which fix the position of the frozen dives.
At the end I changed a little the implementation of loadComplete to the following:
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);
}
where the array arOps are defined as
var arOps = ["eq", "ne", "lt", "le", "gt", "ge", "bw", "bn", "in", "ni", "ew", "en",
"cn", "nc"];
As the result one will have the demo which I referenced at the beginning of my answer. If you would type some filter in the searching filter toolbar or in the advanced searching dialog the caption of the grid will be changed (like in your original example), but all frozen dives will have the correct position.
这篇关于为什么 Jqgrid 冻结列似乎不适用于过滤器行和过滤器标题?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
