如何顯示和隱藏使用數據表的列jquery

我需要顯示和隱藏數據表的列做javascript測試後，但它不工作的好。如何顯示和隱藏使用數據表的列jquery

這是我測試JavaScript：

if ($('#commune_to_display').val()==""){ 
    $('#utable td:nth-child(2)').hide(); 
    $('#commune_to ').hide(); 
}

該測試工作只是在數據表的第一頁，分頁後，列仍然是可見的。

我該如何解決？

來源

2017-07-25 youssef hassoun

您可以顯示/隱藏列，如下所示。只需將3和4替換爲您的實際列索引。

var table = $('#utable').DataTable(); 
table.column(3).visible(true); // To show 
table.column(4).visible(false); // To hide

來源

2017-07-25 11:30:08

JavaScript代碼是這樣的：

$(document).ready(function() { 
    var table = $('#example').DataTable({ 
     "scrollY": "200px", 
     "paging": false 
    }); 

    $('a.toggle-vis').on('click', function (e) { 
     e.preventDefault(); 

     // Get the column API object 
     var column = table.column($(this).attr('data-column')); 

     // Toggle the visibility 
     column.visible(! column.visible()); 
    }); 
});

的html代碼：

<table id="example" class="display" cellspacing="0" width="100%"> 
     <thead> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Age</th> 
       <th>Start date</th> 
       <th>Salary</th> 
      </tr> 
     </thead> 
     <tfoot> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Age</th> 
       <th>Start date</th> 
       <th>Salary</th> 
      </tr> 
     </tfoot> 
     <tbody> 
      <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> 
</tbody> 
    </table>

您可以在這裏瀏覽和運行完整的例子：https://datatables.net/examples/api/show_hide.html

來源

2017-07-25 11:56:24

如何顯示和隱藏使用數據表的列jquery

回答

相關問題