"Select all" 使用表格排序器时出现问题

Question

我有一个显示数据的搜索屏幕。如果我得到 200 行。 select所有 select 所有行的所有复选框。

我的问题是，当用户通过 selecting 过滤器选项过滤行时，根据当时的过滤器，我的 selectAll 仍然 selects 减少到 70 左右所有 200 行。我只想 select 过滤的行。我们正在使用 jQuery 来过滤下面的代码。如果可能，纯 JavaScript 解决方案将是最好的（因为我对 jQuery 了解不多）。 jQuery 是最后的偏好，但还可以。我很乐意让页面正常工作。

这是我的代码：

<script src="js/jquery-1.4.4.min.js" type="text/javascript" />
<script src="js/jquery.tablesorter.js"></script>
<script src="js/jquery.tablesorter.widgets.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>


<h:commandButton  type="button" id="selectAll" value="Select All"   onclick="selectAllCheckboxes()">

selectAllCheckboxes()

代码如下：

var checkboxes = table.getElementsByTagName('INPUT');
for (var i = 0; i < checkboxes.length; i++) {
                     if (checkboxes[i].type == 'checkbox' && checkboxes[i].disabled ==false) {
             checkboxes[i].checked = true;
         }
    }

Answer 1

可选方案：筛选行时，添加到每个行属性 filtered=true，然后在 selectAll select 上只有具有此属性的行，例如

    var filteredRows=$('rows[filtered]');
    var notFilteredRows=$('rows:not([filtered])');

您没有发布HTML，因此我看到了完整的解决方案：

$('rows[filtered]').each(function(){
   $(this).closest('input[type=checkbox]').attr('checked','checked');
});

Answer 2

假设您的复选框是已过滤的 tr 的子项，您可以这样做（未经测试但应该有效）：

selectAllCheckboxes(){
    $('tr:not(.filtered) input[type=checkbox]').attr('checked', 'checked');
}

如果您要使用 jQuery，您不妨将它用于一切。看到人们使用 jQuery 并在 $('#id') 做同样的事情时仍然输入 "document.getElementById('id')"，这让我发疯。同样使用 jQuery 到 select 元素数组，您可以在数组中的所有元素上设置属性，而无需执行 for 循环。

"Select all" 使用表格排序器时出现问题

"Select all" issue when using the tablesorter

jquery

tablesorter

selectall