没有数据时如何制作不可见的数据表?

问题描述

当表格里面没有任何数据(行)时，是否可以隐藏表格?我正在使用查询数据表插件.

我在文档中找不到任何选项.

解决方案

尽管提出了很好的建议，但我认为仍然需要(另一个)答案.

1. 使用 dataTables，

   永远不会为空 - 或 :empty - 因为 dataTables 强制你有一个 和

   隐藏

   是不够的，还必须隐藏*_wrappper——
   code> 包含样式表、分页、过滤器框等.

   您可以利用 fnInitComplete :

   $('#table').dataTable({//像往常一样初始化参数fnInitComplete:函数(){if ($(this).find('tbody tr').length

   这将隐藏 dataTable 及其所有自动生成的内容，如果

   中没有包含数据的行.

   更新

   [请参阅评论以澄清] 那么您需要一种完全不同的方法.这适用于 Chrome 和 FireFox，对于 IE 无法判断:

   忘记fnInitComplete，改用以下代码:

   var dataTable = $('#table').dataTable();$("#table").on('DOMNodeInserted DOMNodeRemoved', function() {if ($(this).find('tbody tr td').first().attr('colspan')) {$(this).parent().hide();} 别的 {$(this).parent().show();}});//这显示了数据表(简化)数据表.fnAddData(['a','b','c','d','e']);//这将它隐藏起来(假设只有一行)数据表.fnDeleteRow(0);

   Is it possible to hide a table when it doesn't have any data(rows) inside?I'm using the query datatables plugin.

   I couldn't find any option in the documentation.

   解决方案

   Despite good suggestions I think there still needs (another) answer.

   1. Using dataTables a <table> will never be empty - or :empty - since dataTables enforces you to have a <thead> and a <tbody>

   2. It is not enough to hide the <table>, you must hide the *_wrappper also - the <div> that contains the styled table, pagination, filter-box and so on.

   You can take advantage of fnInitComplete :

   $('#table').dataTable({
      //initialization params as usual
      fnInitComplete : function() {
         if ($(this).find('tbody tr').length<=1) {
            $(this).parent().hide();
         }
      }
   });
   

   This will hide the dataTable and all its autogenerated content, if there is no rows holding data in <tbody>.

   ---

   Update

   [See comments for clarification] Then you need a completely other approach. This works in Chrome and FireFox, cant tell for IE :

   Forget about fnInitComplete, use the following code instead :

   var dataTable = $('#table').dataTable();
   
   $("#table").on('DOMNodeInserted DOMNodeRemoved', function() {
     if ($(this).find('tbody tr td').first().attr('colspan')) {
       $(this).parent().hide();
     } else {
       $(this).parent().show();
     }
   });
   
   //this shows the dataTable (simplified)
   dataTable.fnAddData(
       ['a','b','c','d','e']
   );
   
   //this hides it (assuming there is only one row)
   dataTable.fnDeleteRow(0);
   

   这篇关于没有数据时如何制作不可见的数据表?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

   08-05 00:12
   Powered by LMLPHP ©2024 没有数据时如何制作不可见的数据表 0.034614

   2024-12-28 04:56:20 1735332980