javascript - 删除内表过滤器 Bootstrap

Question

我有一个可过滤表，其中一列包含可折叠列表。可折叠的 table 包含另一张 table 。 Sample of the situation.

问题是，当编写任何内容来仅过滤所需的项目时，内表也会被过滤。有没有办法避免这种情况。

也欢迎提出有关如何显示此类内容的建议。

Answer 1

如果您只想从“名称”列中进行过滤，可以尝试使用下面的 code :

    $('#filter').keyup(function () {
        var stringValue = $(this).val();
        $("#outer-table tr.row").each( function( index ) {
            $(this).hide();
            $(this).find(".panel-title a:contains("+stringValue+")").parents("tr").show();
        });
    });

编辑:我已经测试了上面的新代码，它按预期工作。

HTML 更改，更容易获取 ONLY 每个 <tr>这是你的外表的一部分:

1. 将外部表标签更改为 <tbody class="searchable"> ，进入此，<tbody id="outer-table" class="searchable">

2. 然后为每个 <tr> 添加一个选择器位于外部表内，但不位于内部表内，如下所示:

    </tr>
    <tr class="row">
           <td><div id="collapsibleMain2" class="panel-group">
   
    </tr>
    <!-- and so on -->
   

有关我上面使用的 jQuery 函数的更多信息:

• contains
• each
• hide