ExtJS2.0实用简明教程 - Form布局
Form布局由类Ext.layout.FormLayout定义,名称为form,是一种专门用于管理表单中输入字段的布局,这种布局主要用于在程序中创建表单字段或表单元素等使用。
看下面的代码:
Ext.onReady(function(){ new Ext.Panel({ renderTo:"hello", title:"容器组件", width:300, layout:"form", hideLabels:false, labelAlign:"right", height:120, defaultType: 'textfield', items:[ {fieldLabel:"请输入姓名",name:"name"}, {fieldLabel:"请输入地址",name:"address"}, {fieldLabel:"请输入电话",name:"tel"} ] } ); });
上面的代码创建了一个面板,面板使用Form布局,面板中包含三个子元素,这些子元素都是文本框字段,在父容器中还通过hideLabels、labelAlign等配置属性来定义了是否隐藏标签、标签对齐方式等。上面代码的输出结果如下图所示:
可以在容器组件中把hideLabels设置为true,这样将不会显示容器中字段的标签了,如下图所示:
在实际应用中,Ext.form.FormPanel这个类默认布局使用的是Form布局,而且FormPanel还会创建与 <form> 标签相关的组件,因此一般情况下我们直接使用FormPanel即可。上面的例子可改写成如下的形式:
Ext.onReady(function(){ new Ext.form.FormPanel({ renderTo:"hello", title:"容器组件", width:300, labelAlign:"right", height:120, defaultType: 'textfield', items:[ {fieldLabel:"请输入姓名",name:"name"}, {fieldLabel:"请输入地址",name:"address"}, {fieldLabel:"请输入电话",name:"tel"} ] } ); });
程序结果与前面使用Ext.Panel并指定form布局的一样,如下图所示:
ExtJS2.0实用简明教程 - Form布局的更多相关文章
- 2013 duilib入门简明教程 -- 界面布局(9)
上一个教程实现的标题栏代码中,并没有看到处理自适应窗口大小的代码,但是窗口大小变化后,按钮的位置会跟着变化,这是因为我们将按钮放到了HorizontalLayout.VerticalLayou ...
- duilib入门简明教程 -- 界面布局(9)
上一个教程实现的标题栏代码中,并没有看到处理自适应窗口大小的代码,但是窗口大小变化后,按钮的位置会跟着变化,这是因为我们将按钮放到了HorizontalLayout.VerticalLayou ...
- duilib入门简明教程 -- 界面布局(9) (转)
原文转自:http://www.cnblogs.com/Alberl/p/3343806.html 上一个教程实现的标题栏代码中,并没有看到处理自适应窗口大小的代码,但是窗口大小变化后,按钮的 ...
- 2013 duilib入门简明教程 -- 总结 (20)
duilib的入门系列就到尾声了,再次提醒下,Alberl用的duilib版本是SVN上第个版本,时间是2013.08.15~ 这里给出Alberl最后汇总的一个工程,戳我下载,效 ...
- DUILIB入门简明教程
电子书下载: DUILIB入门简明教程.chm 文章作者: Alberl 电子书制作: 邓学彬 目录: 2013 duilib入门简明教程 -- 前言(1) 2013 duilib入门简明教程 ...
- 转载乙醇大师的appium简明教程
appium简明教程(11)——使用resource id定位(仅支持安卓4.3以上系统) 乙醇 2014-06-28 21:01 阅读:16406 评论:21 appium简明教程(10)——控件定 ...
- ExtJs2.0里Ext.form.Radio水平排列布局
ExtJs2.0好像不支持单选框组,因此用两个name相同单选框来实现单选框组 var radio1 = new Ext.form.Radio({boxLabel:'男',name:'sex',i ...
- HTML简明教程(二)
HTML简明教程(二) 一.HTML 图像 二.HTML 表格 三.HTML 列表 四.HTML div和 span 五.HTML 布局 六.HTML 表单和输入 七.HTML 框架 八.HTML内联 ...
- Lisp简明教程
此教程是我花了一点时间和功夫整理出来的,希望能够帮到喜欢Lisp(Common Lisp)的朋友们.本人排版很烂还望多多海涵! <Lisp简明教程>PDF格式下载 <Lisp简明教程 ...
随机推荐
- WinForm中DataGridView复制选中单元格内容解决方案
WinForm中DataGridView鼠标选中单元格内容复制方案 1.CTR+C快捷键复制 前提:该控件ClipboardCopyMode属性设置值非Disable: 2.鼠标框选,自定义代码实现复 ...
- Redis 笔记(六)—— ZSET 常用命令
常用命令 命令 用例和描述 ZADD ZADD key-name score member [score member ...] —— 将带有分值的成员添加到 HSET 中 ZREM ZREM key ...
- Maven快照版本要这样用才真的香!
Bug的身世之谜 今天又分享一个问题解决的故事.请看下图框起来的错误,明显就是找不到这个class嘛! 下面我们按照正常人的思路去排查这个问题,既然找不到class那就先看这个依赖的jar包有没有,如 ...
- docker中使用mysql数据库详解(在局域网访问)
开发过程中经常需要安装.调试mysql数据库,还需要在各种操作系上安装包依赖,实在是繁琐,因此就研究了一下如何在docker上运行一个mysql镜像,省却了我安装.找依赖的问题. 注:本文所有内容均在 ...
- Evolution of Image Classifiers,进化算法在神经网络结构搜索的首次尝试 | ICML 2017
论文提出使用进化算法来进行神经网络结构搜索,整体搜索逻辑十分简单,结合权重继承,搜索速度很快,从实验结果来看,搜索的网络准确率挺不错的.由于论文是个比较早期的想法,所以可以有很大的改进空间,后面的很大 ...
- 2016蓝桥杯报纸页数(C++C组)
题目: 报纸页数X星球日报和我们地球的城市早报是一样的,都是一些单独的纸张叠在一起而已.每张纸印有4版.比如,某张报纸包含的4页是:5,6,11,12,可以确定它应该是最上边的第2张报纸.我们在太空中 ...
- 浅谈ArrayList
浅谈ArrayList 废话不多说(事实是不会说),让我们直接进入正题 首先讲一讲最基本的ArrayList的初始化,也就是我们常说的构造函数,ArrayList给我们提供了三种构造方式,我们逐个来查 ...
- AJ学IOS 之二维码学习,快速生成二维码
AJ分享,必须精品 二维码是一项项目中可能会用到的,iOS打开相机索取二维码的速度可不是Android能比的...(Android扫描二维码要来回来回晃...) 简单不多说,如何把一段资料(网址呀,字 ...
- 怎么搭建python环境?很简单,就几步的事
现在学习python的人越来越多了,而学习python必备的就是搭建python环境,那么,到底怎么搭建python环境呢? 首先,你需要有安装包,这个去官网下载就可以了,如果不会的话,可以看文章底部 ...
- Nikto使用方法
Introduction Nikto是一款开源的(GPL)网站服务器扫描器,使用Perl基于LibWhisker开发.它可以对网站服务器进行全面的多种扫描,包括6400多个潜在危险的文件/CGI,检查 ...