1

我们有一个 MVC3 视图，其中包含多个 jqgrid。我现在有两个按钮展开和折叠。单击展开按钮时，我需要调整页面中所有 jqgrid 的大小以将其宽度增加 100 像素，单击 Collpase 按钮​​时，我需要调整页面中所有 jqgrid 的大小以将其宽度减小 100 像素。有没有简单的方法来使用 jquery 而不是给所有 jqGrids $("#grid1", "#grid2", "#grid3")？

4

2 回答 2

0

您可以使用 css 类轻松完成。将一个新类说 jqgridsClass 添加到用于 jqGrid 的所有 div 中，例如：

<div id="grid1" class="jqgridsClass">
<div id="grid2" class="jqgridsClass">
<div id="grid3" class="jqgridsClass">

现在上面的陈述可以简化为

$(".jqgridsClass")

从

$("#grid1", "#grid2", "#grid3")

希望能帮助到你...

于 2013-09-25T11:09:51.910 回答
0

我找不到获取所有 jqGrid 实例的方法；但是您可以在定义它们时将每个 jqGrid 实例引用添加到数组中。

当您通过迭代数组来完成时，您将拥有每个网格实例，并且您可以做自己的事情。

代码：

var $grids = $("#grid1, #grid2, #grid3").jqGrid({
    datatype: "local",
    height: 250,
    colNames: ['Inv No', 'Thingy', 'Blank', 'Number', 'Status'],
    colModel: [{
        name: 'id',
        index: 'id',
        width: 60,
        sorttype: "int"
    }, {
        name: 'thingy',
        index: 'thingy',
        width: 90,
        sorttype: "date"
    }, {
        name: 'blank',
        index: 'blank',
        width: 30
    }, {
        name: 'number',
        index: 'number',
        width: 80,
        sorttype: "float"
    }, {
        name: 'status',
        index: 'status',
        width: 80,
        sorttype: "float"
    }],
    caption: "Stack Overflow Example",
    // ondblClickRow: function(rowid,iRow,iCol,e){alert('double clicked');}
});

$("#resizeMe").click(function () {
    $($grids).each(function (index) {
        $(this).jqGrid('setGridHeight', "20px");
    });

});

演示：http: //jsfiddle.net/IrvinDominin/XQmgK/

于 2013-09-25T11:11:38.787 回答