学习ExtJS(十) form布局

来源:互联网 发布:inside 知乎 编辑:程序博客网 时间:2024/06/05 20:01

一、  Form布局由类Ext.layout.FormLayout定义,名称为form,是一种专门用于管理表单中输入字段的布局,这种布局主要用于在程序中创建表单字段或表单元素等使用。

hideLabels:tru表示隐藏标签,默认为false。
labelAlign:标签队齐方式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"}
                ]
                }
                );
二、在实际应用中,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"}
                ]
                }
                );
0
0
(请您对文章做出评价)
原创粉丝点击