javascript - DataTables 和 Nette；刷新片段删除数据表元素

Question

我在与 Nette 一起使用 DataTables 时遇到问题。

我的 JavaScript 代码:

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

HTML 网络:

{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 片段时，DataTables 元素(页面、顺序等)被删除。如果刷新页面，这些元素将返回。我正在使用 Nette Framework 2.3 和 Doctrine 2。

Answer 1

DataTable 是在 $(document).ready() 事件中从 HTML 创建的，该事件发生在页面加载时。如果您在不刷新网页的情况下刷新代码段，DataTable 将丢失，并且不会重新创建，因为该事件尚未再次触发。您需要做的是在处理片段刷新的代码末尾添加一个新的 $('.table').DataTables(); 调用(我不熟悉 nette所以我不确定那会发生在哪里)。