ExtJs之FieldSet和FieldContainer
<!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css"> <script type="text/javascript" src="ExtJs/ext-all.js"></script> <script type="text/javascript" src="ExtJs/bootstrap.js"></script> <script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script> <script type="text/javascript"> Ext.onReady(function() { Ext.QuickTips.init(); Ext.create('Ext.form.Panel', { title: 'Ext.form.FieldSet.Sample', labelWidth: 40, width: 220, frame: true, renderTo: 'form', bodyPadding: 5, items: [{ title: 'ProductInfo', xtype: 'fieldset', collapsible: true, bodyPadding: 5, defaults: { labelSeparator: ': ', labelWidth: 50, width: 160 }, defaultType: 'textfield', items: [{ fieldLabel: 'Site' },{ fieldLabel: 'Price' }] },{ title: 'ProductDesc', xtype: 'fieldset', bodyPadding: 5, checkboxToggle: true, checkboxName: 'description', labelSeparator: ': ', items: [{ fieldLabel: 'Info', labelSeparator: ':', labelWidth: 50, width: 160, xtype: 'textarea' }] }] }); Ext.create('Ext.form.FormPanel', { title: 'Ext.form.FieldContainer.Sample', width: 600, frame: true, renderTo: 'form1', bodyPadding: 5, fieldDefaults: { labelSeparator: ': ', labelWidth: 160, width: 360, msgTarget: 'side' }, defaultType: 'textfield', items: [{ fieldLabel: 'ProductName' },{ xtype: 'fieldcontainer', fieldLabel: 'ProductDate', layout: { type: 'hbox', align: 'middle' }, combineErrors: true, fieldDefaults: { hideLabel: true, allowBlank: false }, defaultType: 'textfield', items: [{ fieldLabel: 'Year', flex: 1, inputId: 'yearId' },{ xtype: 'label', forId: 'yearId', text: 'Year' },{ fieldLabel: 'Month', flex: 1, inputId: 'monthId' },{ xtype: 'label', forId: 'monthId', text: 'Month' },{ fieldLabel: 'Day', flex: 1, inputId: 'dayId' },{ xtype: 'label', forId: 'dayId', text: 'Day' }] },{ fieldLabel: 'SiteSource' }] }); }); </script> </head> <body> <div id='form'></div> <div id='form1'></div> </body> </html>
ExtJs之FieldSet和FieldContainer的更多相关文章
- 跟我一起学extjs5(22--模块Form的自己定义的设计)
跟我一起学extjs5(22--模块Form的自己定义的设计) 前面几节完毕了模块Grid的自己定义,模块Form自己定义的过程和Grid的过程类似,可是要更复杂一些.先来设计一下要完 ...
- 21、手把手教你Extjs5(二十一)模块Form的自定义的设计
前面几节完成了模块Grid的自定义,模块Form自定义的过程和Grid的过程类似,但是要更复杂一些.先来设计一下要完成的总体目标. 1、可以有多个Form方案,对应于显示.新增.修改.审核.审批等功能 ...
- ExtJs之字段集FieldSet
//Ext.form.FieldSet扩展自Ext.container.Container.其优点就是把相同字段集中在一起,在外面字段外面加了个线"围住"他们. // ...
- EXTJS 4.2 资料 控件之 xtype: "fieldcontainer",追加html
{ xtype: "fieldcontainer", layout: "hbox", items: [ { fieldLabel: '素材目录', name: ...
- ExtJS扩展:扩展grid
ExtJs的grid功能很强大,但是有时候觉得总是少那么一点点功能,我们就来扩展它,让它用起来更方便. 今天我们要扩展的是:根据记录的选择数量来禁用或启用grid toolbar上的某些按钮. 本文所 ...
- Extjs 源码组成(4.0.7)
(function(){})()形式的自执行,构建Ext对象(0~584) 1 设置全局对象EXt:global.Ext = {}, 2 实现了Ext对象面向对象编程的基础方法,如,apply,ex ...
- 扩展ExtJs 4.2.1 htmleditor 添加图片功能
做项目的时候遇到这样一个问题,因为我是用ExtJs做的后台管理框架,所以当我使用ExtJs htmleditor 控件 的时候,发现没有图片上传的功能,于是我打算在网上找找有关的文章,居然真有人写过, ...
- Extjs学习笔记--(一vs增加extjs智能感知)
1,编写class.js var classList=[ "Ext.layout.container.Absolute", "Ext.layout.container.A ...
- ExtJS 4.2 组件的查找方式
组件创建了,就有方法找到这些组件.在DOM.Jquery都有各自的方法查找元素/组件,ExtJS也有自己独特的方式查找组件.元素.本次从全局查找.容器内查找.form表单查找.通用组件等4个方面介绍组 ...
随机推荐
- ubuntu server 14.10 安装 nodejs
apt-get install nodejs 会报错,提示内核版本过低.如果升级,可能遇到提示boot空间不足,要求释放更多空间: sudo aptitude purge ~ilinux-image- ...
- 51.ISE中的DCM全局时钟转为普通IO
在用DCM这个IP核时,它的输入时钟为全局时钟引脚输入,输出有两种情况,第一,可以直接接在全局时钟引脚:第二,可以通过ODDR2原语接在普通IO引脚:说下第二种是怎么用的: DCM DCM_INST ...
- 4.FPGA芯片管脚解释
用户I/O:不用解释了. 配置管脚: MSEL[1:0] 用于选择配置模式,比如AS.PS等. DATA0 FPGA串行数据输入,连接到配置器件的串行数据输出管脚. DCLK FPGA串行时钟输出 ...
- Oracle把两个空格以上的空格,替换为两个空格
substr( ,instr(,)),)) ) 解释如下: 1. 去掉原字串左右的空格的字符(STR),2.查找STR中空格出现二次的位置(LOC),3.从STR中的第一位到LOC-1截取STR||L ...
- Struts1+JQuery的例子
Struts1+JQuery的例子 2014年2月10日 11:25 Struts1+JQuery+JSON/XML的例子 1.Struts+JQuery+XML struts-config.xml如 ...
- C++ vector介绍
<span style="font-family: Arial; ">在此总结一下模板vector的使用介绍</span> 标准库vector类型使用需要的 ...
- vs2013中使用nuget下载cefsharp winform包
cefsharp是chrome的一个开源项目,基于webkit的一个浏览器.下载cefsharp需要安装nuget.之后管理nuget程序包,联机搜索cef即可找到winform包.
- java笔试题(1)
char型变量中能不能存贮一个中文汉字? char型变量是用来存储Unicode编码的字符的,unicode编码字符集中包含了汉字,所以,char型变量中当然可以存储汉字啦.不过,如果某个特殊的汉字没 ...
- 【每日scrum】NO.5
尝试采用自己的地图,绘点并计算路径,但是地图打开出现问题.
- SVG基本图形及clipPath;
利用SVG可以实现很多复杂的图形,SVG的功能开发者们已经开发许多,今天初识一下SVG的基本图形绘制, <svg viewbox="0,0,400,400" style=&q ...