JQuery tablesorter附加数据不排序

发布于 2024-10-09 00:05:52 字数 1153 浏览 3 评论 0原文

我也尝试使用 tablesorter 插件将数据附加到表中（http://tablesorter.com）我使用以下代码：

<table id="sortme" border="1" style="width: 200px;">             
<thead>
    <tr>
        <th>first name</th>
        <th>last name</th>
        <th>age</th>
    </tr>
</thead>
<tbody>
       <tr>
          <td>will</td>
          <td>smith</td>
          <td>1</td>
      </tr> 
...................
</tbody>
</table>
<a href="#" id="test">Click me!</a>

并且：

$(document).ready(function() {
 var i = 5;
 $("#sortme").tablesorter({
     sortList: [[2,0]]         
 }); 
 $("#test").click(function() {
     $("#sortme tbody").append('<tr><td>NEW</td><td>NEW</td><td>'+(i++)+'</td></tr>');
     $("#sortme").trigger("update");
     var s = [[2,0]];
     $("#sortme").trigger("sorton",[s]);
     return false;
 });
});

问题是附加行保留在顶部，为什么？请参阅示例：http://jsfiddle.net/jmU3Z/8/

原文

Im trying too append data to a table with the tablesorter plugin (http://tablesorter.com)
Im using the following code:

<table id="sortme" border="1" style="width: 200px;">             
<thead>
    <tr>
        <th>first name</th>
        <th>last name</th>
        <th>age</th>
    </tr>
</thead>
<tbody>
       <tr>
          <td>will</td>
          <td>smith</td>
          <td>1</td>
      </tr> 
...................
</tbody>
</table>
<a href="#" id="test">Click me!</a>

And:

$(document).ready(function() {
 var i = 5;
 $("#sortme").tablesorter({
     sortList: [[2,0]]         
 }); 
 $("#test").click(function() {
     $("#sortme tbody").append('<tr><td>NEW</td><td>NEW</td><td>'+(i++)+'</td></tr>');
     $("#sortme").trigger("update");
     var s = [[2,0]];
     $("#sortme").trigger("sorton",[s]);
     return false;
 });
});

Problem is the appended row stays at top, why?
See example: http://jsfiddle.net/jmU3Z/8/

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

夏末 2024-10-16 00:05:52

万一其他人偶然发现这个。

当处理“sorton”事件时，DOM 尚未分配给 table.config.parsers。 “sorton”事件处理需要包含在 1 毫秒的超时内。

将 jquery.tablesorter.js（第 803 行）中现有的“sorton”绑定替换为以下内容：

}).bind("sorton", function (e, list) {
    var me = this;
    setTimeout(function () {
        $(this).trigger("sortStart");
        config.sortList = list;
        // update and store the sortlist
        var sortList = config.sortList;
        // update header count index
        updateHeaderSortCount(me, sortList);
        // set css for headers
        setHeadersCss(me, $headers, sortList, sortCSS);
        // sort the table and append it to the dom
        appendToTable(me, multisort(me, sortList, cache));
    }, 1);

In case anyone else stumbles across this.

By the time the "sorton" event is handled the DOM hasn't been assigned the table.config.parsers. The "sorton" event handling needs to be wrapped in a 1 millisecond timeout.

Replace the existing "sorton" bind in jquery.tablesorter.js (line ~803) with the following:

}).bind("sorton", function (e, list) {
    var me = this;
    setTimeout(function () {
        $(this).trigger("sortStart");
        config.sortList = list;
        // update and store the sortlist
        var sortList = config.sortList;
        // update header count index
        updateHeaderSortCount(me, sortList);
        // set css for headers
        setHeadersCss(me, $headers, sortList, sortCSS);
        // sort the table and append it to the dom
        appendToTable(me, multisort(me, sortList, cache));
    }, 1);

回复收藏 0 原文