ExtJS Form配置文档格式.docx
- 文档编号:21828100
- 上传时间:2023-02-01
- 格式:DOCX
- 页数:14
- 大小:24.12KB
ExtJS Form配置文档格式.docx
《ExtJS Form配置文档格式.docx》由会员分享,可在线阅读,更多相关《ExtJS Form配置文档格式.docx(14页珍藏版)》请在冰豆网上搜索。
hideMode
值:
visibility,offsets,display
hideParent
true显示隐藏组件同时显示隐藏其容器(默认false)
labelSeparator
字段标签于字段间分隔符(默认'
:
msgTarget
设置错误信息显示位置:
qtip:
显示浮动提示信息
title:
显示一浏览器浮动提示信息
under:
在字段下方显示一提示信息
side:
在字段右边显示一提示信息
*/
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL
=
../extjs2.0/resources/images/default/s.gif'
;
Ext.QuickTips.init();
//初始化信息提示功能
var
config
{
信息提示(qtip)'
//表单标题
height:
100,
//表单高度
width:
300,
//表单宽度
frame:
true,
//是否渲染表单
labelSeparator:
//分隔符
labelWidth:
60,
//标签宽
labelAlign:
right'
//标签对齐方式
renderTo:
form'
//表单定位
//表单子元素数组
items:
[
//单行文本框
new
Ext.form.TextField({
fieldLabel:
姓名'
//标签内容
allowBlank:
false,
//是否允许空
blankText:
请输入姓名'
//为空之后的错误信息提示
msgTarget:
qtip'
//显示浮动信息提示框
//msgTarget:
title'
under'
//注意表单高度!
side'
//注意表单宽度!
}),
//数字框
Ext.form.NumberField({
年龄'
false,
请输入年龄'
})
]
}
form
Ext.form.FormPanel(config);
2.Ext_表单面板_Ext.form.FormPanel
/*Ext.form.BasicForm基本表单组件,提供对表单动作的支持并负责初始化已有字段组件
默认采用Ajax方式进行异步数据提交,
如要用原始方法提交表单可覆盖表单的onSubmit及Submit方法
myForm
Ext.form.BasicForm("
form-el-id"
{
onSubmit:
Ext.emptyFn,
//覆盖onSubmit方法为空函数
submit:
function()
//覆盖submit方法
this.getEl().dom.submit();
//调用底层表单元素的submit方法进行表单提交
}
});
Ext.form.BasicForm主要配置表
baseParams
Object
传递到请求中的参数,如{id;
123'
foo:
bar'
errorReader
DataReader
表单提交时用来读取错误信息的数据读取器
fileUpload
设置表单是否进行文件上传
method
设置表单提交方式GET或POST
reader
设置表单执行load读取数据时的数据读取器
timeout
设置表单动作的超时时间
trackResetOnLoad
设置true表单在初次创建将清除最近一次加载的数据或用setValues()设置数据
url
设置表单执行请求时默认提交路径
waitMsgTarget
Mixed
默认情况下,表单执行中显示的是以Ext.MessageBox.wait组件,可指定其他目标元素
Ext.form.BasicForm常用方法(继承到FormPanel中,可直接使用)
clearInvalid():
BasicForm
清除表单中所有无效验证信息
doAction(String/Object
actionName,
执行一个预定动作(Ext.form.Action.Submit或Ext.form.Action.Load)或自定义扩
[Object
options]):
Ext.form.Action动作,执行一个特殊请求处理
findField(String
id):
Field
通过id,dataIndex,name,hiddenName查找表单字段
isDirty():
如表单在第一次读取后被更改过返回true
isValid():
如果客户端验证成功返回true
load(Object
options):
执行表单读取动作,配置对象options被传递到action中
loadRecord(Record
record):
从一个数据记录中读取数据到表单中
markInvalid(Array/Object
errors):
成批设置表单字段为验证无效,参数可为数组[{id;
2'
msg:
me'
},...],JSON对象
reset():
重置表单
setValues(Array/Object
values):
成批设置表单字段值[{id:
name'
value:
tom'
},...]
submit(Object
执行表单提交动作,配置对象options被传递到action中
updateRecord(Record
持久化表单数据到记录集中
Ext.form.FormPanel支持的主要表单组件
Ext.form.Checkbox
复选框
Ext.form.ComboBox
下拉列表框
Ext.form.DateField
日期选择框
Ext.form.Hidden
隐藏域
Ext.form.HtmlEditor
HTML文本编辑器
Ext.form.NumberField
数字输入框
Ext.form.Radio
单选框
Ext.form.TextArea
多行文本框
Ext.form.TextField
单行文本框
Ext.form.TimeField
时间选择框
Ext.form.TriggerField
触发按钮文本框
Ext.form.FormPanel主要配置项目表
buttons
Array
按钮对象配置数组
buttonAlign
设置buttons中按钮对齐方式:
left,center(默认),right
footer
是否创建表单页脚
header
是否创建表单标题栏,如设置title自动创建
headerAsText
标题栏中是否显示title默认true
items
一子元素或子元素数组
labelAlign
表单标签对齐方式:
left(默认),top,right
labelWidth
表单标签宽度
title
表单标题
Ext.form.FormPanel常用方法表
getForm():
Ext.form.BasicForm
获取表单面板基本表单对象
void
加载表单内容,为Ext.form.BasicForm.load代理
starMonitoring():
开始监控表单有效状态
stopMonitoring():
停止监控表单有效状态
3.Ext_基本表单_Ext.form.BasicForm
成批设置表单字段值[{id:
设置buttons中按钮对齐方式:
4.Ext_基本文本输入框_Ext.form.TextField
/*Ext.form.TextField主要配置表:
allowBlank
是否允许为空(默认true)
blankText
为空验证失败提示信息
emptyText
空字段中默认显示信息
grow
设置字段是否根据内容伸缩(默认false)
growMax
字段伸展的最大宽度(默认800)
growMin
字段收缩最小宽度(默认30)
inputType
字段类型(默认text)
maxLength
字段允许输入最大长度
masLengthText
最大长度验证失败提示信息
minLength
字段允许输入最小长度
minLenghtText
最小长度验证失败提示信息
regex
javascript正则表达式
regexText
正则表达式验证失败提示信息
selectOnFocus
设置当前字段得到焦点是否自动选择已存在文本(默认false)
vtype
验证类型名字
vty
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- ExtJS Form配置 Form 配置