學(xué)習(xí)ExtJS form布局
更新時間：2009年10月08日 00:03:52 作者：
ExtJS form布局使用說明，需要的朋友可以參考下。
一、 Form布局由類Ext.layout.FormLayout定義，名稱為form，是一種專門用于管理表單中輸入字段的布局，這種布局主要用于在程序中創(chuàng)建表單字段或表單元素等使用。
hideLabels：tru表示隱藏標(biāo)簽，默認為false。
labelAlign：標(biāo)簽隊齊方式left、right、center,默認為left。
Ext.onReady(function(){
var _panel = new Ext.Panel({
title:"人員信息",
renderTo:Ext.getBody(),
frame:true,
width:500,
height:300,
layout:"form",
hideLabels:false,
labelAlign:"right",
height:120,
defaultType: 'textfield',
items:[
{fieldLabel:"姓名",name:"name"},
{fieldLabel:"請輸入地址",name:"address"},
{fieldLabel:"請輸入電話",name:"tel"}
]
}
);
二、在實際應(yīng)用中，Ext.form.FormPanel這個類默認布局使用的是Form布局，因此我們直接使用FormPanel即可。上面的例子可改寫成如下的形式：
Ext.onReady(function(){
var _panel = new Ext.FormPanel({
title:"人員信息",
renderTo:Ext.getBody(),
frame:true,
width:500,
height:300,
hideLabels:false,
labelAlign:"right",
height:120,
defaultType: 'textfield',
items:[
{fieldLabel:"姓名",name:"name"},
{fieldLabel:"請輸入地址",name:"address"},
{fieldLabel:"請輸入電話",name:"tel"}
]
}
);
hideLabels：tru表示隱藏標(biāo)簽，默認為false。
labelAlign：標(biāo)簽隊齊方式left、right、center,默認為left。
復(fù)制代碼 代碼如下:
Ext.onReady(function(){
var _panel = new Ext.Panel({
title:"人員信息",
renderTo:Ext.getBody(),
frame:true,
width:500,
height:300,
layout:"form",
hideLabels:false,
labelAlign:"right",
height:120,
defaultType: 'textfield',
items:[
{fieldLabel:"姓名",name:"name"},
{fieldLabel:"請輸入地址",name:"address"},
{fieldLabel:"請輸入電話",name:"tel"}
]
}
);
二、在實際應(yīng)用中，Ext.form.FormPanel這個類默認布局使用的是Form布局，因此我們直接使用FormPanel即可。上面的例子可改寫成如下的形式：
復(fù)制代碼 代碼如下:
Ext.onReady(function(){
var _panel = new Ext.FormPanel({
title:"人員信息",
renderTo:Ext.getBody(),
frame:true,
width:500,
height:300,
hideLabels:false,
labelAlign:"right",
height:120,
defaultType: 'textfield',
items:[
{fieldLabel:"姓名",name:"name"},
{fieldLabel:"請輸入地址",name:"address"},
{fieldLabel:"請輸入電話",name:"tel"}
]
}
);
相關(guān)文章
extjs 列表框(multiselect)的動態(tài)添加列表項的方法
最近公司一個項目,因為要使用div模擬的窗口,因為久聞extjs的大名,因此就想在項目中使用一下.首先下載了multiselect的extjs3.0 demo.看到的代碼這里我就不粘貼了.2009-07-07
ExtJS由一系列的類庫組成，一旦頁面成功加載了ExtJS庫后，我們就可以在頁面中通過javascript調(diào)用ExtJS的類及控件來實現(xiàn)需要的功能。2009-04-04
Extjs學(xué)習(xí)筆記之一 初識Extjs之MessageBox
去官網(wǎng)下載好extjs的壓縮包，解壓縮之后得到如下目錄結(jié)構(gòu)。2010-01-01
面版表示頁面上的一塊相對獨立的區(qū)域，利用傳統(tǒng)的html+css要構(gòu)建靈活統(tǒng)一的區(qū)域并非易事。2010-01-01
Extjs 繼承Ext.data.Store不起作用原因分析及解決
有關(guān)Extjs 繼承Ext.data.Store 不起作用的原因有很多種，接下來與大家分享下，本人遇到的，這個Store寫出來之后 是不會起到作用的，感興趣的朋友可以看下詳細的原因及解決方法2013-04-04
在Ext的使用過程中，一不留心就出現(xiàn)了亂碼，包括在客戶端提交給服務(wù)器的數(shù)據(jù)中出現(xiàn)了亂碼和服務(wù)器端返回給客戶端的數(shù)據(jù)中出現(xiàn)了亂碼，下面簡單分析一下出現(xiàn)亂碼的原因。2009-04-04
Ext.util.Observable有一個重要的功能，可以為某個事件設(shè)置攔截器，統(tǒng)一管理方法的處罰。使用capture()和releaseCapture()來實現(xiàn)這個功能。2010-01-01
Extjs組件的定義在網(wǎng)上看到了一個實例，于是拷了下來留著以后用，現(xiàn)在把它曬出來與大家一起分享，感興趣的各位可不要錯過了哈2013-06-06
extjs grid設(shè)置某列背景顏色和字體顏色的實現(xiàn)方法
extjs grid設(shè)置某列背景顏色和字體顏色的實現(xiàn)步驟，需要的朋友可以參考下。2010-09-09
本文介紹在桌面程序開發(fā)中很常用也很簡單的工具欄和菜單，但是在通常的web開發(fā)中，要實現(xiàn)好工具欄和菜單并非易事，然而extjs使我們能夠用類似桌面程序開發(fā)的方法來開發(fā)web的工具欄和菜單。2010-01-01