学习ExtJS form布局


Posted in Javascript onOctober 08, 2009

一、 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"} 
] 
} 
);
Javascript 相关文章推荐
cloudgamer出品ImageZoom 图片放大效果
Apr 01 Javascript
jQuery :nth-child前有无空格的区别分析
Jul 11 Javascript
js实现广告漂浮效果的小例子
Jul 02 Javascript
JQuery Highcharts 动态生成图表的方法
Nov 15 Javascript
javascript实现微信分享
Dec 23 Javascript
JS传值出现中文参数乱码的解决方法
Jun 30 Javascript
关于Javascript回调函数的一个妙用
Aug 29 Javascript
MUI 实现侧滑菜单及其主体部分上下滑动的方法
Jan 25 Javascript
基于Vue自定义指令实现按钮级权限控制思路详解
May 23 Javascript
如何为你的JavaScript代码日志着色详解
Apr 08 Javascript
vue.js this.$router.push获取不到params参数问题
Mar 03 Javascript
基于javascript实现日历功能原理及代码实例
May 07 Javascript
学习ExtJS fit布局使用说明
Oct 08 #Javascript
学习ExtJS border布局
Oct 08 #Javascript
学习ExtJS Column布局
Oct 08 #Javascript
学习ExtJS 访问容器对象
Oct 07 #Javascript
学习ExtJS Window常用方法
Oct 07 #Javascript
学习ExtJS Panel常用方法
Oct 07 #Javascript
学习ExtJS TextField常用方法
Oct 07 #Javascript
You might like
Ajax+PHP边学边练 之五 图片处理
2009/12/03 PHP
用PHP的超级变量$_GET获取HTML表单(Form) 数据
2011/05/07 PHP
PHP错误Warning: Cannot modify header information - headers already sent by解决方法
2014/09/27 PHP
BOOM vs RR BO5 第二场 2.14
2021/03/10 DOTA
javascript 动态添加事件代码
2008/11/30 Javascript
javascript检测页面是否缩放的小例子
2013/05/16 Javascript
js实现跨域访问的三种方法
2015/12/09 Javascript
JavaScript实现带播放列表的音乐播放器实例分享
2016/03/07 Javascript
关于cookie的初识和运用(js和jq)
2016/04/07 Javascript
AngularJS自定义控件实例详解
2016/12/13 Javascript
NodeJs模拟登陆正方教务
2017/04/28 NodeJs
详解Vue项目部署遇到的问题及解决方案
2019/01/11 Javascript
element-ui如何防止重复提交的方法步骤
2019/12/09 Javascript
VUE异步更新DOM - 用$nextTick解决DOM视图的问题
2020/11/06 Javascript
Python 过滤字符串的技巧,map与itertools.imap
2008/09/06 Python
Python警察与小偷的实现之一客户端与服务端通信实例
2014/10/09 Python
简单解析Django框架中的表单验证
2015/07/17 Python
Python2.x版本中基本的中文编码问题解决
2015/10/12 Python
python 的列表遍历删除实现代码
2020/04/12 Python
Python实现PS滤镜碎片特效功能示例
2018/01/24 Python
解决pycharm无法识别本地site-packages的问题
2018/10/13 Python
Django生成PDF文档显示网页上以及PDF中文显示乱码的解决方法
2019/12/17 Python
Python 字典中的所有方法及用法
2020/06/10 Python
Python本地及虚拟解释器配置过程解析
2020/10/13 Python
html5超简单的localStorage实现记住密码的功能实现
2017/09/07 HTML / CSS
晨会主持词
2014/03/17 职场文书
《宋庆龄故居的樟树》教学反思
2014/04/07 职场文书
户外活动总结范文
2014/04/30 职场文书
初中生思想道德自我评价
2015/03/09 职场文书
自荐信格式模板
2015/03/27 职场文书
学校推普周活动总结
2015/05/07 职场文书
简单的辞职信范文(2016最新版)
2015/05/12 职场文书
Go语言 go程释放操作(退出/销毁)
2021/04/30 Golang
Java如何实现树的同构?
2021/06/22 Java/Android
尝试使用Python爬取城市租房信息
2022/04/12 Python
Java 多线程并发FutureTask
2022/06/28 Java/Android