使用Javascript更改ExtJS網格高度

Question

如何指向ExtJS網格的對象並手動設置高度（以像素爲單位）？

例如，與此相同：

var grid = new Ext.grid.GridPanel({ 
    store: store, 
    columns: [ 
     {id:'company',header: 'Company', width: 160, sortable: true, dataIndex: 'company'}, 
     {header: 'Price', width: 75, sortable: true, renderer: 'usMoney', dataIndex: 'price'}, 
     {header: 'Change', width: 75, sortable: true, renderer: change, dataIndex: 'change'}, 
     {header: '% Change', width: 75, sortable: true, renderer: pctChange, dataIndex: 'pctChange'}, 
     {header: 'Last Updated', width: 85, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'} 
    ], 
    stripeRows: true, 
    autoExpandColumn: 'company', 
    height: 350, 
    width: 600, 
    title: 'Array Grid', 
    // config options for stateful behavior 
    stateful: true, 
    stateId: 'grid'   
}); 

我想我能夠在「網格」對象指向，然後設置網格的大小？

任何幫助將是太棒了！

Answer 1

我不完全確定，如果我明白你想要什麼。你想在網格初始化或渲染之後設置網格高度？

使用PHP的使用在啓動時設置的高度：

var heigtht_set = <?php echo $grid_height ?>; 

var grid = new Ext.grid.GridPanel({ 
    store: store, 
... 
    height: heigtht_set ? heigtht_set : 350, 
...  
}); 

您還可以設置變量heigtht_set其他任何可用的JavaScript變量;

，如果你想使你可以使用自動調用setHeight（網格）的後setthe高度，以600：

var heigtht_set = 600; 
grid.setHeight(heigtht_set); 

Answer 2

除了Thariama答案的上方，如果你不會或不能保持一個參考到「網格」變量，您可以爲您正在創建的組件提供一個ID，然後在代碼中使用ExtJS::getCmp方法來獲取您使用其ID創建的ExtJS組件的引用。請注意，在這種配置中，配置屬性「ID」設置爲「myGrid」

var grid = new Ext.grid.GridPanel({ 
    store: store, 
    columns: [ 
     {id:'company',header: 'Company', width: 160, sortable: true, dataIndex: 'company'}, 
     {header: 'Price', width: 75, sortable: true, renderer: 'usMoney', dataIndex: 'price'}, 
     {header: 'Change', width: 75, sortable: true, renderer: change, dataIndex: 'change'}, 
     {header: '% Change', width: 75, sortable: true, renderer: pctChange, dataIndex: 'pctChange'}, 
     {header: 'Last Updated', width: 85, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'} 
    ], 
    stripeRows: true, 
    autoExpandColumn: 'company', 
    height: 350, 
    width: 600, 
    title: 'Array Grid', 
    // config options for stateful behavior 
    stateful: true, 
    stateId: 'grid', 
    id: 'myGrid' 
}); 

網格初始化後打開螢火蟲和下面的代碼將設置網格的高度：

Ext.getCmp('myGrid').setHeight(600);