2011-10-03 76 views
0

我是新的extjs佈局。 我有一個帶有默認佈局的表單面板。我添加了一個包含網格和兩個按鈕的字段集。我正在渲染一個窗體面板到div。表格面板佈局問題在extjs2

事業部在JSP

<div id="mydiv"></div> 

FormPanel中的JS

var fp = new Ext.FormPanel(
       { 
        standardSubmit :true, 
        id :'panel', 
        autoHeight :true, 
        layout: 'border', 
        bodyCfg: { cls: 'template' }, 
        bodyPadding :10, 
        margin :'0 0 20', 
        frame :'true', 
        renderTo :'mydiv', 
        buttonAlign:'right', 
        items : [topPanel , fieldset ] 
    }); 

我想要的形式和網格被調整爲每個窗口大小(窗口大小調整shold調整元素)現在如果嘗試我調整窗口的大小,fieldset會根據窗口調整大小,但網格不是。

現在我給出了一個固定的高度和寬度。沒有那個網格只是水平擴展。

我不想給任何高度的寬度面板,網格。如何實現?當我搜索我們是否將面板渲染到視口時,它將處理調整大小。如果是這樣,那麼我應該在extjs中創建一個視口並將其重定向到div?如果是的話那麼該怎麼做?

編輯:或者我必須使用CSS與div?

任何指針表示讚賞。 謝謝

回答

0

你可以創建一個視口,這將如你所說,照顧調整大小。

在視口內,您可以添加面板'項目'集合。如果您希望面板適合視口,則應使用「適合」佈局。

東西沿着這些路線將是觀念的正確類型:

var viewPort = new Ext.Viewport({ 
    id: "blaa", 
    items: [fp], 
    layout: "fit" 
)}; 

我沒有到過這裏的語法,但你的想法。

+0

謝謝,但在這種情況下,我需要在div上渲染viwport嗎?怎麼做? – Coder

+0

一個視口被設計爲適合那個視口,因此可能不是放入div的最佳候選人。它沒有renderTo屬性。什麼推動了將面板放在div中的需求,您是否可以重新考慮佈局?如果沒有,就像Varun提到的那樣,你可以在面板裏面使用'fit'佈局,但是我不是100%,因爲它不是一個Ext.container – dougajmcdonald

+0

好吧,我是現在將面板添加到視口。 vieport有邊界佈局。添加1個區域:北部的面板,並添加區域中心的fieldset(其中包含gridPanel)。但是,調整網格大小的問題仍然是一樣的。任何建議? – Coder

0

使用錨定屬性。例如:anchor: '-10',無論您希望使用此功能的組件如何。這將根據它的父母寬度自動調整組件的寬度。

因此,如果您formpanelwidth 100像素,任子組件具有anchor : '-10px'集,將有寬度widthOfParent - anchorWidth

您還可以設置佈局fit。這會自動將所有子組件都擴展爲父母的width