html文字列から複数の行をjQuery DataTableに追加する方法

Question

html tr行を追加するjQuery DataTableがあります。これらの行は、html文字列の形式で表示されます。標準のjQueryを使用してこれらをテーブルに追加することはできますが、これはDataTableオブジェクトをバイパスし、テーブルが無効になったときに失われることを意味します。 DataTableのrows.add（）関数を使用するには、配列形式の行が必要です。

// table_rows actually comes from an ajax call. 
var table_rows = '<tr>...</tr><tr>...</tr><tr>...</tr>'; 

// This successfully adds the rows to the table... :-) 
$('#datatable_id').append(table_rows); 

// ...but those rows are lost when we redraw the DataTable. :-(
table = $("#datatable_id").DataTable(); 
table.order([0,'desc']).draw(); 

残念ながら、サーバーから戻ってくるものを簡単に変更できないため、クライアント側の解決策が必要なようです。

Answer 1

テーブルを直接操作したり、適切なjQuery DataTables APIメソッドを使用したりしないでください。

rows.add() APIメソッドを使用して、trノードを供給しながら複数の行を追加できます。サーバーの応答からtrノードを構築することができます。例えば

：

var table_rows = '<tr><td>Tiger Nixon</td><td>System Architect</td><td>Edinburgh</td><td>61</td><td>2011/04/25</td><td>$320,800</td></tr>'; 

table.rows.add($(table_rows)).draw(); 

は、コードやデモンストレーションのためthis jsFiddle参照してください。