easyui datagrid动态改变大小教程(代码)
程序员文章站
2022-07-09 15:35:19
easyui Layout中改变大小时对应datagrid大小自适应问题
由于center的layout中 datagrid被嵌入了一个p,当左右拖动west的Layout时,在...
easyui Layout中改变大小时对应datagrid大小自适应问题
由于center的layout中 datagrid被嵌入了一个p,当左右拖动west的Layout时,在Layout center中的datagrid宽度不变(可能是datagrid外面被嵌套了一个p吧,当没有p时好像是可以动态适应的),导致用户体验问题,通过panel的onResize事件去处理,将动态取得宽度,通过datagrid 的resize方法设置到datagrid中,可现实动态适应宽度和高度
<p class="easyui-layout" data-options="fit:true"> <p data-options="region:'west',split:true" title="群体" style="width:500px;"> <table id="grouppushlist" style="padding-top: 0px;"></table> </p> <p id='Content_table' data-options="region:'center',title:'操作展示',iconCls:'icon-ok'"> <p id="personallist" class="easyui-resizable" style="display:none;width:inherit;height:inherit;" > <table id="pushlist" ></table> </p> </p> </p>
以下实现事件监听:
$(document).ready(function(){ $('#Content_table').panel({ onResize:function(width, height){ $('#personallist').width(width); $('#personallist').height(height); $('#pushlist').datagrid('resize',{width:width}); } }); }
推荐阅读
-
jquery easyui dataGrid动态改变排序字段名的方法
-
jQuery动态改变图片显示大小(修改版)的实现思路及代码
-
easyui datagrid动态改变大小教程(代码)
-
EasyUI可调整大小组件代码实现教程
-
EasyUI的DataGrid绑定Json数据源的方法讲解(代码教程)
-
Unity 在代码中动态改变RectTransform大小的方法
-
JavaScript如何动态改变图片显示大小的示例代码
-
jQuery动态改变图片显示大小(修改版)的实现思路及代码_jquery
-
PHP中改变图片的尺寸大小的代码_PHP教程
-
jQuery动态改变图片显示大小(修改版)的实现思路及代码_jquery