Question

在我撕掉我的头发之前，我在这里问什么是简单的＆＃39;我失踪的东西。我有一个Infragistics igGrid，我有一些按钮供用户隐藏（过滤）一些行。在Infragistics论坛上，我发现了这个建议的代码：

function hide() {
$("#igGrid").igGrid("allRows").each(function(index) {

    var id = $(this).attr("colName");

    // Any row with ID < 4 will be hidden
    if (id < 4) {
        $(this).css("display", 'none');
    }

});

看起来很简单，但它不起作用。我的10次尝试中也没有获得“idCol”＃39;这一行。

真正让我感到困惑的是，在Chrome调试中，＆＃39;这个＆＃39;显示为＆＃39; tr＆＃39; （在IE中它是一个HTMLTableRowElement）!!它有一个＆＃39;细胞＆＃39;属性是HTMLCollection ==＆gt;确切地说我想要的！但是，我在下面尝试过的任何内容实际上都没有获得单元格/列的值。

        var aa = $(this).attr("colName");                    // undefined
        var bb = $(this);                                    // shows in debugger as e.fn.e.init[1]     ????
        var cc = bb.cells[3];                                // Uncaught TypeError: Cannot read property '3' of undefined
        var dd = bb.getRowIndex();                           // Uncaught TypeError: Undefined is not a function

        var a = $(this).cells;                               // undefined
        var b = $(this).cells[3];                            // Uncaught TypeError: Cannot read property '3' of undefined
        var c = $(this).getRowIndex();                       // Uncaught TypeError: Undefined is not a function  
        var d = $(this).attributes.getNamedItem("colName");  // Uncaught TypeError: Cannot read property 'getNamedItem' of undefined
        var e = $(this).attributes.colName;                  // Uncaught TypeError: Cannot read property 'colName' of undefined
        var f = $(this).getNamedItem("colName");             // Uncaught TypeError: Undefined is not a function
        var g = $(this).getAttribute("colName");             // Uncaught TypeError: Undefined is not a function

那我错过了什么？

在弄清楚之后，我发现另一个问题。显然，上面隐藏行的条件不会是硬编码的＆＃39; 4。在外部onclick函数中，我设置了一个保存条件值的变量。但是在这个igGrid函数中，我看到我的变量超出了范围。如何将我的变量传递给此＆＃39; hide（）＆＃39;功能

Answer 1

过滤和隐藏之间存在差异。过滤将从tbody中删除行，隐藏只会使行不可见。最简单的解决方案是将过滤器应用于表格。这很容易绑定到按钮单击处理程序，请参阅下面的JSFiddle链接。

<强>隐藏

您可以通过将其css显示属性设置为“无”来隐藏行; 您可以使用以下选项来选择所有行。

//select all rows, excluding the header and footer rows.
var gridRowSelector = 'table.ui-iggrid-table.ui-widget-content>tbody>tr';
//hide a row when clicking on it
$(gridRowSelector).click(function () {
    $(this).hide();
});
//unhide all hidden rows
$(gridRowSelector).show();

<强>过滤

您可以通过两种方式过滤网格。

在网格上启用过滤，然后使用列标题中的下拉列表设置过滤器。

$("#grid").igGrid({  
    features: [
            {
                name: "Filtering",
                type: "local",
                mode: "advanced",
                filterDialogContainment: "window"
            }
        ]
});

手动将过滤器应用于网格。请参阅IGGrid过滤：http://help.infragistics.com/jQuery/2015.1/ui.igGridFiltering

   $('#grid').igGridFiltering("filter", ([
            {fieldName: "Age", 
                  expr: "30", 
                  cond: "greaterThan", 
                 logic: "OR"}]));

要删除所有过滤器，只需将空过滤器应用于网格：

//remove all filters
$('#grid').igGridFiltering("filter", "");

我创建了一个有隐藏/取消隐藏和过滤/未过滤的工作JSFiddle。

JSFiddle：http://jsfiddle.net/seadonk/76g5shak/

隐藏igGrid行

1 个答案: