Ext gridPanel宽度100%时width:10000 BUG解决

1)

bodyStyle:'width:100%',
autoWidth:true,

只有设了第一句话,第二句话才有效

 

2)

不知是Ext的Bug还是其他原因,当初始化grid并将宽度设为100%时,其宽度会变成10000px宽,高度100%则grid高度根据grid内容自适应,而不是根据其所在容器自适应,一直没有很好的办法,只能使用绝对宽高,但有时这是很不方便的。
对此问题一直耿耿于怀,后来终于想出了一个办法,还真的可行,但就是感觉有点蹩脚。
一般我们都通过render到指定id的层上来展现grid,虽然不能让grid宽高自适应,但层还是可以的。
如我们这里要用到的层是<div id="orgGrid"></div>。我们可以在这个层上设置高宽。
如<div id="orgGrid" style="width:100%;height:250px"></div>。
则在初始化grid的时候让其宽高与orgGrid宽高相同即可,并在页面resize时重新计算器宽度即可(一般高度固定还是比较好)。

js代码如下:

//..前面若干行代码省略,如ds/colmodel等 var orgGrid=Ext.get("orgGrid"); //展示grid的容器 var grid = new Ext.grid.GridPanel({ title:"人员管理", cm: colModel, //列模式 sm:selMode, //选择模式 width:orgGrid.getComputedWidth(), height:orgGrid.getComputedHeight(), autoExpandColumn:"memory", //自动扩展宽度的列 autoScroll:true, loadMask:{msg:"数据加载中,请稍等..."} }); grid.render(orgGrid); //把grid铺到id为grid的容器中 window.onresize=function(){ grid.setWidth(0); grid.setWidth(orgGrid.getComputedWidth()); };

 

这样不论页面宽度怎么变化grid都会自适应页面容器了。

你可能感兴趣的:(function,ext,扩展,div)