0

下の表があります。

<table id="myTable" class="tablesorter"> 
<thead> 
<tr> 
    <th>No</th>
    <th>Name</th>     
    <th>Email</th> 
    <th class='time'>Time</th> 
    <th>Price</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
    <td>1</td>
    <td>Smith</td>    
    <td>jsmith@gmail.com</td> 
    <td class='time'>60 mins</td> 
    <td>45</td> 
</tr> 

</tbody> 
</table>

jquery tablesorter プラグインを使用しています。すでに、テーブルソーターはうまく機能しています。すべての列がソート可能であることがわかります。

私のアプリケーションでは、[更新] ボタンをクリックすると、行が動的に追加または削除されます。つまり、テーブルの内容が変更されます。テーブルの変更後、並べ替えが機能しません。

ここにjsfiddle デモがあります。

以下は、tablesorter を呼び出すコードです。

   $("#myTable").tablesorter({
        headers: { 
            4: { sorter: "integer"}, 
            2: {sorter: false} 
        },
        debug:true,
        textExtraction:function(node){
           var $node = $(node)
           var text = $node.text();  
           if ($node.hasClass('time')) {
                text = text.replace('mins', '');
            };
            return text;            
        }
    });

与えられたデモの例では、追加された行が最初の行になり、並べ替えには使用されません。

4

2 に答える 2

3

API ドキュメントの基本的なルックオーバーにより、デモへのこのリンクが明らかになりました: http://tablesorter.com/docs/example-empty-table.html

重要なのは、次のコード行です。

    // let the plugin know that we made a update 
    $("table").trigger("update");

それをコードに追加すると...

   $("#myTable").append(row).trigger("update");

...それは動作します

于 2012-12-10T08:25:05.943 に答える
1

THE FIXを Christian Bach のオリジナル バージョンに適用するか、Mottie の改良版 v2.x を使用してください。

.trigger("update")修正されていない元のバージョンに依存しないでください。

于 2012-12-10T08:26:50.293 に答える