当前位置： 移动技术网 > IT编程>网页制作>CSS > easyui datagrid动态改变大小教程（代码）

easyui datagrid动态改变大小教程（代码）

2018年01月30日  | 移动技术网IT编程  | 我要评论

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});
   
}
  });
}

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网