js 控制 easyui datagrid 隐藏之后显示不来的问题

最近有的用到easyui的datagrid,有一个这样的需求,就是当触发一个事件之后控制datagrid的显示与隐藏,初始状态是将其datagrid隐藏起来。

说起隐藏datagrid的时候,也遇到了一些问题,关于easyui的datagrid是不可以直接用display这个属性的,那若是想要隐藏这个table,那么就要在它的外面写一个父级div,然后通过控制这个div的隐藏与显示去满足这个需求。

<div class="divEditTabKc" style="display: none"> <table id="editTabKc" class="easyui-datagrid" border="1" style="height: 180px;width:100%"></table></div>

这个隐藏是满足了,但是当直接用js控制外面divEditTabKc的show和hide时,就出现了当想要其显示时,table却没有显示,我查看了一下代码,这个时候table的宽只有3像素,那么自然解决的方法就有了,注意在显示时调用再调用一次resize就可以显示出来,如下:

 $("#editTabKc").datagrid("resize");

这样便实现了table的显示与隐藏。如果小伙伴也遇到了同样的情况可以试试这个方法!

相关文章