排序HTML表格，即得到通過JQuery

Question

附加

你好，我想要使用的tablesorter（https://github.com/christianbach/tablesorter）清理我的表，我產生THROU JQuery.appends。這是我的代碼的外觀：

$(document).ready(function() { 


*Lotsa more code .....* 



    $.get("../skillqueue",{keyid: keyid, charid: charid},function(xmlskillqueue){ 
    console.log("XML Skillqueue"); 
    console.log(xmlskillqueue); 

    //Variables for 
    var rowsets = xmlskillqueue.getElementsByTagName("rowset"); 
    var skillrows; 

    for(var i = 0; i < rowsets.length; i++){ 
     if(rowsets[i].getAttribute("name") == "skillqueue"){ 
      skillrows = rowsets[i].getElementsByTagName("row"); 
     } 
    } 

    //Defines Table Headers 
    $("#tableskillqueuelist").append(
      "<thead>" + 
      "<tr>" + 
      "<th>Order: </th> "+ 
      "<th>Skill Name: </th> "+ 
      "<th>Training to: </th> "+ 
      "<th>Starts:</th> "+ 
      "<th>Ends:</th> "+ 
      "</tr> "+ 
      "</thead>"+ 
      "<tbody>" 
    ); 

    for(var i = 0; i < skillrows.length; i++){ 
     (function(i, skillrows) { 

      $.get("../getitemname", {itemid:skillrows.getAttribute("typeID")},function(itemname){    
       $("#tableskillqueuelist").append(
         "<tr> " + 
         "<td>" + skillrows.getAttribute("queuePosition") + ". " +       
         "<td>" + itemname + "</td>" + 
         "<td>" + "|Train to: " + skillrows.getAttribute("level") + "</td>" + 
         "<td>" + "|Training Starts: " + skillrows.getAttribute("startTime") + "</td>" + 
         "<td>" + "|Training Ends: " + skillrows.getAttribute("endTime") + "<td>" +      
         "</tr>" 
       ); 
      }) 
     })(i, skillrows[i]);      
    } 
    //Ends the table body 
    $("#tableskillqueuelist").append("</tbody>"); 
}); 
}); 

現在我想知道什麼，我需要做的有它成功運行$（「＃tableskillqueuelist」）的tablesorter（）;方法。由於每當我嘗試運行它時，#tableskillqueuelist似乎都是空的。

Answer 1

你需要告訴你已經修改了數據，並要通過觸發事件對它進行排序表分揀機。從文檔

實施例：http://tablesorter.com/docs/example-ajax.html

$("table").tablesorter(); 
    $("#ajax-append").click(function() { 
    $.get("assets/ajax-content.html", function(html) { 
     // append the "ajax'd" data to the table body 
     $("table tbody").append(html); 
     // let the plugin know that we made a update 
     $("table").trigger("update"); 
     // set sorting column and direction, this will sort on the first and third column 
     var sorting = [[2,1],[0,0]]; 
     // sort on the first column 
     $("table").trigger("sorton",[sorting]); 
    }); 
    return false; 
}); 

HTH