使用 JQuery 进行动态排序答案

【问题标题】：Dynamic Sorting with JQuery使用 JQuery 进行动态排序
【发布时间】：2010-10-12 11:35:47
【问题描述】：

我有一个名为“结果”的 HTML 表格元素。该表使用 Web 服务的结果动态填充。当用户单击按钮时会触发 Web 服务。该按钮调用如下所示的“getResults”函数。此函数返回 JSON 格式的对象集合。当 Web 服务成功返回时，会调用一个名为 getResultsCompleted 的函数。将结果动态添加到表中后，我在其上调用 tablesorter 初始化程序，我的代码如下所示：

function getResults() {
  $("#results > tbody").html("");
  $.ajax({
    type: "GET",
    url: "/GetResults",
    contentType: "application/json; charset=utf-8",
    success: getResultsCompleted,
  });
}

function getResultsCompleted(results) {
    var html = "";
    if (results.d.length > 0) {     
    $.each(results.d, function (i, r) {
      html += getRow(r);
    });
  }
  $("#results > tbody:last").append(html);
  $("#results").tablesorter(); 
}

第一次加载结果时，排序工作正常。但是，在随后的加载中，排序无法正常工作。当调用“getResults”函数时，我觉得我需要以某种方式“销毁”tablesorter。但我不知道怎么做。也许我完全错了。有人可以帮帮我吗？谢谢

http://tablesorter.com/docs/

【问题讨论】：

标签： jquery tablesorter

【解决方案1】：

想通了。来自文档：

$("table").trigger("update");

【讨论】：

【解决方案2】：

你可能会破坏表格分类器，但我没有使用过这个分类器的经验

我用flexigrid，也有jgrid，两者都是很好的表格操纵器

但您可以尝试删除内容并像这样重建

  function getResultsCompleted(results) {
      var html = "";
      if (results.d.length > 0) {     
      $.each(results.d, function (i, r) {
        html += getRow(r);
      });
    }
    $("#results > tbody:last").children().remove();
    $("#results > tbody:last").append(html);
    $("#results").tablesorter(); 
  }

【讨论】：