没有数据时如何制作不可见的数据表? [英] How to make invisible datatable when there is no data?

问题描述

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

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

解决方案

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

1. 使用 dataTables，

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

   隐藏

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

   您可以利用 fnInitComplete :

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

   这将隐藏 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);
   

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

   登录 关闭

   扫码关注1秒登录

   

   发送“验证码”获取 | 15天全站免登陆
   友情链接： IT屋 Chrome插件 谷歌浏览器插件

   IT屋 ©2016-2022 琼ICP备2021000895号-1 站点地图 站点标签 SiteMap <免责申明> 本站内容来源互联网,如果侵犯您的权益请联系我们删除.