文章/答案/技术大牛

发布

社区首页 >问答首页 >表排序分页程序不能与页中的多个表一起工作。仅前10个项目可见

问表排序分页程序不能与页中的多个表一起工作。仅前10个项目可见
EN

Stack Overflow用户

提问于 2014-01-15 03:58:21

回答 3查看 4.4K关注 0票数 1

嗨，我正在使用bootstrap 3的表排序，该插件的网址是http://mottie.github.io/tablesorter/docs/

当页面中只有一个表时，一切都是正常的。我在读完http://mottie.github.io/tablesorter/docs/example-widget-bootstrap-theme.html之后就这么做了。

如$(“表”).tablesorter({......})

但是当在同一页中有多个表时，寻呼机就不工作了。箭头是禁用的，奇怪的是只有前10个项目是可见的。似乎tablesorter在排序起作用但分页不起作用时被激活。

没有箭头是working.When，我只保留了一张桌子。它工作得很好。到目前为止，我尝试了所有的方法，但都失败了。有人能帮上忙吗。

谢谢!

twitter-bootstrap-3

tablesorter

回答 3

Stack Overflow用户

发布于 2014-01-15 09:37:16

我想我已经在tablesorter issue中回答了你的问题。基本上，要确保每个pager对其指定的表都有一个唯一的名称。

<table class="table1">...<table>
<div class="pager1">...</div>

<table class="table2">...<table>
<div class="pager2">...</div>

然后分别初始化每个表

$(".table1").tablesorter().tablesorterPager({ container: '.pager1' });
$(".table2").tablesorter().tablesorterPager({ container: '.pager2' });

票数 2

Stack Overflow用户

发布于 2015-08-13 03:49:35

我遇到了同样的问题，因为我总是关心尽可能的通用，所以我编写了这个简单的代码，为表提供ID，按代码中显示的编号进行编号，并对每个表应用特定的分页程序。

  $(".tablesorter table").each(function(pageTableCount){

    // Check if pageTableCount was initialized, and add 1 to its value
    pageTableCount !==null ? pageTableCount++ : 1;

    // Get the table and add ID with counter
    table = $(this);
    table.attr("id","table-sorter-"+pageTableCount);

    // Does the same with the pager
    pager = table.parent().find(".tablesorter-pager");
    pager.attr("id","table-sorter-pager-"+pageTableCount);

    // Initiate the tablesorter
    table.tablesorter()
    .tablesorterPager({
      container: "#table-sorter-pager-"+pageTableCount
    });

  });

HTML ( BS + FontAwesome)

        <div class="table-responsive tablesorter">
          <table class="table">
            <thead>
              <tr>
                ...
              </tr>
            </thead>
            <tbody>

              <tr>
                ...
              </tr>

            </tbody>
          </table>
          <div class="tablesorter-pager">
            <a href="#" class="first btn btn-default btn-sm btn-icon"><i class="fa fa-angle-double-left"></i></a>
            <a href="#" class="prev btn btn-default btn-sm btn-icon"><i class="fa fa-angle-left"></i></a>
            <span class="pagedisplay"></span>
            <a href="#" class="next btn btn-default btn-sm btn-icon"><i class="fa fa-angle-right"></i></a>
            <a href="#" class="last btn btn-default btn-sm btn-icon"><i class="fa fa-angle-double-right"></i></a>
          </div><!-- tablesorter-pager -->
        </div><!-- .table-responsive -->

希望能有所帮助。

票数 0

Stack Overflow用户

发布于 2015-12-02 21:04:35

您可以使用表排序器在一个表中使用多个表。请参考此。http://www.pearlbells.co.uk/table-pagination/

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/21122785

复制

相似问题

问表排序分页程序不能与页中的多个表一起工作。仅前10个项目可见
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问表排序分页程序不能与页中的多个表一起工作。仅前10个项目可见EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问表排序分页程序不能与页中的多个表一起工作。仅前10个项目可见
EN