2011-01-17 6 views
3

jQuery의 tablesorter로 정렬되는 테이블이있는 웹 페이지에는 동적으로 테이블에 열을 추가하는 기능이 있습니다. 이 때 나는 트리거 ("update")와 trigger ("appendCache")를 호출하여 tablesorter가 새로운 컬럼으로 정렬 할 수있게했다. (나는 또한 tablesorter()를 다시 호출 해 보았다). 그러나 헤더 셀을 클릭하기 전까지는 정렬을위한 위젯이 새 열에 표시되지 않습니다.jQuery의 tablesorter로 관리되는 테이블에 동적으로 열 추가

제 질문은 누구나 위젯을 즉시 표시하는 방법을 알고 있습니까? 감사 제이슨

답변

2
<head> 

    <title>jQuery plugin: Tablesorter 2.0</title> 

    <link rel="stylesheet" href="css/jq.css" type="text/css" media="print, projection, screen" /> 

    <link rel="stylesheet" href="../themes/blue/style.css" type="text/css" media="print, projection, screen" /> 

    <script type="text/javascript" src="../jquery-latest.js"></script> 

    <script type="text/javascript" src="../jquery.tablesorter.js"></script> 

    <script type="text/javascript"> 

    $(function() {  

$(document).ready(function() 
    { 
     $("#myTable").tablesorter(); 
    } 
); 


    }); 
    function append(){ 
     var table = $("#myTable"); 
     $(table).remove(); 
     var tr = $("<tr></tr>"); 
     $("<td></td>").html('Test').appendTo(tr); 
     $("<td></td>").html('test').appendTo(tr); 
     $("<td></td>").html('[email protected]').appendTo(tr); 
     $("<td></td>").html('$5.00').appendTo(tr); 
     $("<td></td>").html('http://www.test.com').appendTo(tr); 
     $(tr).appendTo(table); 
     $(table).appendTo($('#tableholer')); 
     $("#tableholer table").tablesorter(); 
    } 

    </script> 

</head> 
<body> 
    <div id="tableholer"> 
    <table id="myTable" class="tablesorter"> 
    <thead> 
    <tr> 
     <th>Last Name</th> 
     <th>First Name</th> 
     <th>Email</th> 
     <th>Due</th> 
     <th>Web Site</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>Smith</td> 
     <td>John</td> 
     <td>[email protected]</td> 
     <td>$50.00</td> 
     <td>http://www.jsmith.com</td> 
    </tr> 
    <tr> 
     <td>Bach</td> 
     <td>Frank</td> 
     <td>[email protected]</td> 
     <td>$50.00</td> 
     <td>http://www.frank.com</td> 
    </tr> 
    <tr> 
     <td>Doe</td> 
     <td>Jason</td> 
     <td>[email protected]</td> 
     <td>$100.00</td> 
     <td>http://www.jdoe.com</td> 
    </tr> 
    <tr> 
     <td>Conway</td> 
     <td>Tim</td> 
     <td>[email protected]</td> 
     <td>$50.00</td> 
     <td>http://www.timconway.com</td> 
    </tr> 
    </tbody> 
    </table> 
    </div> 
    <input type="button" onclick="append()" value="append"/> 
</body> 

APPEND의 경우이 작업을 할 감사합니다. 삭제하려고해도 똑같이 시도해도 나는 결코 모른다.

+0

나는 그것을 얻는다. 기본적으로 테이블을 제거하고 변경 한 다음 다시 첨부하십시오. 나는 그것을 시도하고 그것은 효과가있다. 감사. – Jason

+0

당신은 환영합니다.하지만 당신은 대답을 받아들임으로써 다른 사람들에게 알려야합니다. –

관련 문제