tablesorter,jquery和动态表的问题

时间:2015-06-09 15:46:53

标签: jquery

我的页面中有一个表格,如下所示:

  <table id="search_table" class="tablesorter table">
      <thead>
          <tr>
            <th>Title</th>
            <th>Rank</th>
            <th>Planning Estimate</th>
            <th>Update</th>
        </tr> 
    </thead>
    <tbody id="search_body">
    </tbody>
</table>

我用这个填充了表格:

  $('#submit').click(function() {
      event.preventDefault();
      var $table = $('#search_body');
      $table.empty();
      $.getJSON("/search_issues/" + $("#folders").val(), function(data) {
          $.each(data, function(index, dict) {
              var $tr = $("<tr></tr>").appendTo($table);
              $tr.append("<td>" + dict['title'] + "</td><td>" + dict['rank'] + "</td><td>" + dict['planning'] + 
                      "</td><td><a href='/update"+dict['id'] + "'>Update</a></td>");
          });
      });
  });

我如何以及在何处定义tablesorter?我试过这个:

$(function() {
    $("table").tablesorter({ theme : 'blue', sortList: [[2,1],[0,0]] });
});

但是如果我点击表头,我会在控制台中看到它:

Uncaught TypeError: Cannot read property '2' of undefined

谢谢,

标记

1 个答案:

答案 0 :(得分:1)

尝试在附加tr和td之后运行一个tablesorter ..在关闭 $。之后尝试在 getJSON 中使用它

$.getJSON("/search_issues/" + $("#folders").val(), function(data) {
          $.each(data, function(index, dict) {
              var $tr = $("<tr></tr>").appendTo($table);
              $tr.append("<td>" + dict['title'] + "</td><td>" + dict['rank'] + "</td><td>" + dict['planning'] + 
                      "</td><td><a href='/update"+dict['id'] + "'>Update</a></td>");
          });
          $("table").tablesorter({ theme : 'blue', sortList: [[2,1],[0,0]] });
      });

以另一种方式可以刷新排序

您可以查看此http://tablesorter.com/docs/example-ajax.html