如何在Symfony中使用DataTables（jQuery）和Twig？

我想在我的Symfony項目中使用jQuery DataTables插件。如何在Symfony中使用DataTables（jQuery）和Twig？

下面的代碼工作：

<table width="100%" id="table_id"> 

         <thead> 
         <tr> 
          <th>Date</th> 
          <th>Salary</th> 
         </tr> 
         </thead> 

         <tfoot> 
         <tr> 
          <th>Date</th> 
          <th>Salary</th> 
         </tr> 
         </tfoot> 

         <tbody> 
          <tr> 
           <td>2011/07/25</td> 
           <td>$170,750</td> 
          </tr> 
          <tr> 
           <td>2009/01/12</td> 
           <td>$86,000</td> 
          </tr> 
          <tr> 
           <td>2011/04/25</td> 
           <td>$320,800</td> 
          </tr> 
          <tr> 
           <td>2011/07/25</td> 
           <td>$170,750</td> 
          </tr> 
          <tr> 
           <td>2009/01/12</td> 
           <td>$86,000</td> 
          </tr> 
         </tbody> 
        </table>

但我有在樹枝循環產生以下代碼中的問題：

  <table width="100%" id="table_id"> 
       <thead> 
       <tr> 
        <th>Date</th> 
        <th>Name</th> 
       </tr> 
       </thead> 

       <tfoot> 
       <tr> 
        <th>Date</th> 
        <th>Name</th> 
       </tr> 
       </tfoot> 

       <tbody> 
        {% for courrier in listCourrier %} 
         <tr> 
          <td>{{ courrier.DateRegister().Creation()|date('d-m-Y') }}</td> 
          <td>{{ courrier.User().Username() }}</td> 
         <tr> 
        {% endfor %} 
       </tbody> 
      </table>

表出現與良好的價值觀，但我不有排序箭頭。這似乎是jQuery和Twig的問題。我寧願不使用Bundle來做到這一點（我嘗試了一些捆綁包，但很難用它來做我想做的）。所以，如果你有任何想法只是簡單地包含DataTable的jQuery插件，我將不勝感激。

來源

2017-04-04 cephal

如果您複製表的來源是合法的HTML？我只是問，因爲這裏看起來都很好。我想另一個問題是你是否包含JS和CSS？ – annoyingmouse

JS和CSS文件都包含在內，因爲當我用上面的等效HTLM替換Twig生成的表格時，它完美地工作。我認爲來自Twig的代碼是有效的（無需排序箭頭的Datatables出現），但Twig和jQuery存在明顯的問題。 – cephal

你看過KnpPaginatorBundle嗎？ –

您可以簡單地使用jQuery的數據表所示：

$(document).ready(function(){ 
      $(document).ready(function() { 
      var data = []; 
      data.push(
       [1,"Sasha","Brenna","0800 1111"], 
       [2,"Sage","Mia","(01012) 405872"], 
       [3,"Chelsea","Allistair","076 0578 0265"], 
       [4,"Uta","Savannah","070 1247 5884"], 
       [5,"Remedios","Berk","0995 181 0007"] 
      ); 

      $('#data_table').DataTable({ 
       data: data, 
      }); 
     }); 
}); 

<table id="data_table"> 
     <thead> 
      <tr> 
       <th>Emp Code</th> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Mobile</th> 
      </tr> 
     </thead> 

     <tbody> 
     <!-- Dynamic Body --> 
     </tbody> 
</table>

Working Fiddle

來源

2017-04-04 06:58:31

謝謝你的回答，但我想使用從我的控制器發送到我的Twig文件的變量。你使用了data.push（），但是你知道另一個函數來獲得我從控制器發送的變量，以便生成我的表的單元格嗎？ – cephal

您可以從您的ajax數據源更改該數據源。它只是一個例子 –

或者你可以使用服務器端的數據表，你可以在其中直接使用控制器數據 –

如何在Symfony中使用DataTables（jQuery）和Twig？

回答

相關問題