DataTablesおよびNette;リフレッシュスニペットがDatatables要素を削除します

Question

Netteと連携して動作するDataTableに問題があります。

私のJavaScriptコード：

$(document).ready(function(){ 
    $('.table').DataTables(); 
}); 

HTML Nette：

{snippet customers} 
    <table class="table table-hover" id="userTable"> 
    <thead> 
     <tr> 
     <th>Name</th> 
     <th>Country</th> 
     <th>Type</th> 
     </tr> 
    </thead>    
    <tbody> 
    {foreach $customers as $customer} 
    <tr> 
     <td> 
      <a href="{$presenter->link(':Customers:show', array('id' => $customer->id))}" target="_blank"> 
      {$customer->name} 
      </a> 
      </td> 
      <td>{$customer->country}</td> 
      <td>{$customer->type}</td>  
     </tr> 
     {/foreach} 
    </tbody> 
    </table> 
{/snippet} 

それは正常に動作しますが、Netteスニペットが更新されたとき、DataTableの要素（ページ、順序など）が削除されます。ページがリフレッシュされると、これらの要素が返されます。 Nette Framework 2.3とDoctrine 2を使用しています。

Answer 1

DataTableは、ページがロードされるときに発生する$(document).ready()イベントのHTMLから作成されます。 Webページを更新せずにスニペットを更新すると、DataTableは失われ、そのイベントが再度トリガーされないため再作成されません。あなたがする必要があるのは、スニペットのリフレッシュを処理するコードの末尾に新しい$('.table').DataTables();コールを追加することです（私はnetteに慣れていないので、どこで発生するのか正確にはわかりません）。