使jqGrid在Web浏览器上响应的方法

Question

我是jqGrid的新手,我需要在调整Web浏览器窗口大小时调整网格大小.我已经申请 autowidth : true;,shrinkToFit: true;在网格但不工作.

设置CSS width : 100%是唯一的一个实现,但是在jqGrid的情况下,
它在许多内部结构width中px明确设置并不好.

什么是解决它的最佳方法？

Answer 1

jqGrid width在许多内部结构(div,表等)上使用固定值.所以不能只设置CSS width : 100%.然而,还有另一种方法可以做到这一点.可以resize在window对象上注册事件处理程序并setGridWidth显式调用.该方法将jqGrid的所有内部结构调整为新宽度.所以这将是干净的方法.

如果你使用,autowidth: true那么jqGrid只将jqGrid的宽度设置为它的父级宽度一次.在$(window).resize处理程序内部,我们可以获得父级的新(当前)宽度并重置网格的值width.相应的代码如下

$(window).on("resize", function () {
    var $grid = $("#list"),
        newWidth = $grid.closest(".ui-jqgrid").parent().width();
    $grid.jqGrid("setGridWidth", newWidth, true);
});

我用$("#list").closest(".ui-jqgrid")的,而不是$("#list")因为jqGrid的建立一些潜在的主要<table>元素.$("#list").closest(".ui-jqgrid")给出包含网格所有元素的外部 div.

改进的小提琴演示演示代码实时.