0

我正在编写一段代码来让用户创建和维护联系人列表。联系人列在表格中，第一个单元格是一个复选框，如果此联系人已经在此联系人列表中，则选中该复选框。

我正在使用 tablesorterpager 插件，因此用户可以轻松地翻阅联系人列表；我有一个用于复选框字段的自定义解析器，它将根据复选框是否被选中来对联系人进行排序。

我的问题是我不能同时让这两个工作。

相关代码是这样的：

$(function() {
        $('#userTable')
                .tablesorter({
                        headers: {
                                0: {
                                        sorter: 'checkbox'
                                }
                        }
                })
                .tablesorterPager({container: $("#pager")});
});

如果我注释掉 .tablesorter 调用或 .tablesorterPager 调用，那么另一个可以正常工作。如果我不评论它们，那么只有第二个调用实际上有效 - 似乎我可以有分页或自定义解析器，但不能同时使用。我已经交换了两个电话，并且始终是第二个正在运行的电话-第一个消失了。

我认为我遗漏了一些明显的东西，但我找不到什么。两个调用本身显然都很好，因为当另一个被注释掉时它们可以工作，但它们不能一起工作。

我正在使用 tablesorter 2.1.19（从这里）；和jQuery 1.7.1

4

1 回答 1

7

当您使用该解析器时，它使用“updateCell”方法来更改单元格内容，但由于该方法使用 rowIndex 和 cellIndex 确定单元格位置，因此当寻呼机处于活动状态时，它可能无法获得准确的信息。因此，最简单的解决方案是将寻呼机removeRows选项设置为false.

这是一个演示

// add parser through the tablesorter addParser method
$.tablesorter.addParser({
  id: 'checkbox',
  is: function(s) {
    return false;
  },
  format: function(s, table, cell, cellIndex) {
    var $c = $(cell);
    // return 1 for true, 2 for false, so true sorts before false
    if (!$c.hasClass('updateCheckbox')) {
      $c.addClass('updateCheckbox').bind('change', function() {
        // resort the table after the checkbox status has changed
        var resort = false;
        $(table).trigger('updateCell', [cell, resort]);
      });
    }
    return ($c.find('input[type=checkbox]')[0].checked) ? 1 : 2;
  },
  type: 'numeric'
});

$(function() {

  $('table')
    .tablesorter({
      widgets: ['zebra'],
      headers: {
        0: { sorter: 'checkbox' }
      }
    })
    .tablesorterPager({
    // target the pager markup - see the HTML block below
    container: $(".pager"),
    // remove rows from the table to speed up the sort of large tables.
    // setting this to false, only hides the non-visible rows; needed
    // if you plan to add/remove rows with the pager enabled.
    removeRows: false
  });

});​
于 2012-04-28T00:30:52.770 回答