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

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


淘汰的方法有下面二种实现：
不知是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:"人员管理",
        ds: ds, //数据源
        cm: colModel, //列模式
        sm:selMode,    //选择模式
        width:orgGrid.getComputedWidth(),
        height:orgGrid.getComputedHeight(),
        autoExpandColumn:"memory", //自动扩展宽度的列
        autoScroll:true,
        loadMask:{msg:"数据加载中，请稍等..."}
     });
     ds.load();
     grid.render(orgGrid); //把grid铺到id为grid的容器中

window.onresize=function(){
        grid.setWidth(0);
        grid.setWidth(orgGrid.getComputedWidth());
};


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



========================================================================

Ext.grid.grid的宽度100%的问题2007-08-24 10:20找了很久，终于是实现了。部分代码如下，希望能给大家提供帮助：

var Result_234=function(){
      var grid;
      return {
       init : function() {
       var CW=Ext.get("div_displayResult").getWidth();//容器宽度
       var C1Width=CW*20/100-10;
       var C2Width=CW*20/100-10;
       var C3Width=CW*20/100-10;
       var C4Width=CW*20/100-10;
       var C5Width=CW*20/100-10;
    var recordType = Ext.data.Record.create([
       {name: "id", type: "int"},
       {name: "agentCity", mapping: "vo.agentCity", type: "string"},
       {name: "arrivalAirport", mapping:"vo.arrival", type: "string"},
       {name: "departureAirport", mapping:"vo.departure", type: "string"},
       {name: "date", mapping: "vo.date",type: "string"},
       {name: "passengerQuantity", mapping: "vo.passengerQuantity",type: "int"}
        ]);
       var ds = new Ext.data.Store({
           proxy: new Ext.data.DWRProxy(CTResult.domLsodOsldPaxReport, true),
           reader: new Ext.data.ListRangeReader({
               totalProperty: 'totalSize',
               id: 'id'
           }, recordType),
           remoteSort: true
       });
       var cm    = new Ext.grid.ColumnModel(
       [
        {
         id: 'agentCity',
         header: '销售城市',
         width: 250,
         sortable: true,
         dataIndex: 'agentCity',
         width: C1Width
        },
        {
         header: '到达',
         width: 250,
         sortable: true,
         dataIndex: 'arrival',
         width: C2Width
        },
        {
         header: '出发',
         width: 250,
         sortable: true,
         dataIndex: 'departure',
         width: C3Width
        },
        {
         header: '日期',
         width: 250,
         sortable: true,
         dataIndex: 'date',
         width: C4Width
        },
        {
         header: '比例',
         width: 250,
         sortable: true,
         dataIndex: 'passengerQuantity',
         width: C5Width
        }        
       ]
      );
       grid = new Ext.grid.EditorGrid('mygrid', {
           ds: ds,
           cm: cm,
           trackMouseOver: true,
         loadMask: true,
         autoExpandColumn: 'agentCity',
         fitContainer: true
       });
       grid.render();
      var gridFoot = grid.getView().getFooterPanel(true);
       var paging = new Ext.PagingToolbar(gridFoot, ds, {
           pageSize: 5,
           displayInfo: true,
           displayMsg: 'display {0} - {1} of {2}',
           emptyMsg: "no record"
       });
    ds.on('beforeload', function() {
       ds.baseParams = {
         param1: 'test111',
         param2: true
       };
     });
    ds.load({params:{start:0, limit:5}});
},
    testx:function(){
     AMAR.displayQueryResultT(grid);
    }
};
}();

gridPanel=new Ext.GridPanel(grid, {closable: false, fitContainer: true})