easyui 隐藏和显示datagrid

2019独角兽企业重金招聘Python工程师标准>>>

easyui隐藏datagrid后，再让其显示，如果用display：block或者display的其他参数时会出现datagrid布局出错的问题，要解决此问题可以将datagrid放到panel内，对panel操作隐藏和显示。

<div id="panelID" class="easyui-panel" data-options="closed:true">
   <table class="easyui-datagrid" data-options="singleSelect:true,
       pagination:true,
       fit:true,
       striped:true,
       fitColumns:true"
       url=""  
">
      <thead>
         <tr>
           <th data-options="field:'id',width:10">ID</th>
           <th data-options="field:'name',width:10">NAME</th>
           <th data-options="field:'sex',width:10">SEX</th>
         </tr>
      </thead>
   </table>
</div>

可以通过data-options参数配置使panel默认隐藏，也可以用jquery使其默认隐藏，如下：

   $(function(){
      $("#panelID").panel("close");
   })

若要使datagrid显示，则使用如下代码：

$(function(){
   $("#panelID").panel("open");
})

 

转载于:https://my.oschina.net/jingyao/blog/777112