Ext Grid表格的自动宽度及高度的实现

希望Ext的表格能自适应外层的div大小，但Ext的Grid构造函数的width、height项不支持100%的设置方式，所以改用以下方式初始化Grid： 

width: Ext.get("content").getWidth(), 
height: Ext.get("content").getHeight(), 

<div id="content"> 
    <div id="grid-example"></div> 
<div> 

#content { 
width: 100%; 
height: 100%; 
} 

完整js代码： 

// create the Grid 
    var grid = new Ext.grid.GridPanel({ 
        store: store, 
        columns: [ 
            {id:'id',header: "序号", width: 50, sortable: true, renderer: keyChange, dataIndex: 'id'}, 
            {header: "数据表表名", width: 100, sortable: true, renderer: hrefChange, dataIndex: 'tableAlias'}, 
            {header: "物理表名", width: 100, sortable: true, dataIndex: 'tableName'}, 
            {header: "类型", width: 75, sortable: true, dataIndex: 'type'} 
        ], 
        stripeRows: true, 
        width: Ext.get("content").getWidth(), 
        height: Ext.get("content").getHeight(), 
addClass:"grid", 
tbar: [{ 
            text: '新增模版', 
            handler : function(){ 
window.location.href = 'templateDefineList4.html'; 
            } 
            },{ 
            text: '删除模版', 
            handler : function(){ 

            } 
        }], 
        bbar: new Ext.PagingToolbar({ 
            pageSize: 15, 
            store: store, 
            displayInfo: true, 
            displayMsg: '当前显示记录 {0} - {1} 总条数 {2}', 
            emptyMsg: '无记录' 
        }) 
    });

转载于:https://www.cnblogs.com/zhaoxd/archive/2013/04/27/3047596.html