Ext.form.BasicForm
对应一个dom中的form,默认是用ajax提交的,如果的确想回传,可以使用如下方式
var myForm. = new Ext.form.BasicForm("form-el-id", {
onSubmit: Ext.emptyFn,
submit: function() {
this.getEl().dom.submit();
}
});
方法:
BasicForm( Mixed el, Object config )
其中config配置为
{
baseParams : Object, //请求时的附加参数,格式为{id: '123', foo: 'bar'}
errorReader : DataReader, //提交时发生验证错误,这个dataReader将会被使用
fileUpload : Boolean, //支持文件上传
method : String, //GET或者POST
reader : DataReader, //load时使用的数据读取器
timeout : Number, //超时时间
trackResetOnLoad : Boolean,//支持使用reset方法恢复原始值
url : String //form要提交的url地址
}
add( Field field1, [Field field2], [Field etc] ) : BasicForm
增加字段field1,field2,etc
applyIfToFields( Object values ) : BasicForm
applyToFields( Object values ) : BasicForm
用传入的values呼叫Ext.applyIf/apply 方法
clearInvalid() : BasicForm
清除当前basicform中所有的非法信息
doAction( String/Object actionName, [Object options] ) : BasicForm
执行预定义的动作actionName,actionName类似"submit","load",也可以是自定义的动作的名字或一个Ext.form.Action的实例,options类似如下对象{
url :String,
method :String,
params :String/Object,
success :Function,
failure :Function,
clientValidation :Boolean
}
findField( String id ) : Field
在当前form中查找id/dataindex/name等于传入的id的field对象
getEl() : Ext.Element
得到当前form对象的element对象
getValues( Boolean asString ) : Object
得到当前form的fields {name:value,name:values}json对象,如果有同名多值,value将是一个数组
isDirty() : Boolean
从初始载入后,是否有field被修改过
isValid() : Boolean
客户端验证成功?
load( Object options ) : BasicForm
等效于doAction('load',options);
loadRecord( Record record ) : BasicForm
从一个record对象取值到当前basicform
markInvalid( Array/Object errors ) : BasicForm
标志非法,[{id:'fieldId', msg:'The message'},...]这样格式的数组或者{id: msg, id2: msg2}格式的对象
remove( Field field ) : BasicForm
从basicform中移除field
render() : BasicForm
在basicForm的fields中寻找,利用id属性检查他们,然后用id属性呼叫applyTo方法
reset() : BasicForm
重置所有值
setValues( Array/Object values ) : BasicForm
设置值,参见getValues
submit( Object options ) : BasicForm
提交表单
updateRecord( Record record ) : BasicForm
利用当前更新record对象,参见loadRecord
事件:
actioncomplete : ( Form. this, Action action )
actionfailed : ( Form. this, Action action )
beforeaction : ( Form. this, Action action )
Ext.form.Field
有了form之后,我们当然还需要field
方法:
Field( Object config )
其中config设置为{
autoCreate : String/Object, //一个{tag: "input", type: "text", size: "20", autocomplete: "off"}这样的对象,或者选 择true,就是前面所说的那个固定内置对象
clearCls : String, //,默认x-form-clear-left
cls : String, //默认样式
disabled : Boolean,
fieldClass : String //x-form-field
fieldLabel : String
focusClass : String //x-form-focus
hideLabel : Boolean //隐藏前导标签
inputType : String //input type="???"
invalidClass : String //x-form-invalid
invalidText : String
itemCls :String
labelSeparator : String //分隔符
msgFx : String
msgTarget : String
name : String
readOnly : Boolean
tabIndex : Number
validateOnBlur : Boolean //true
validationDelay : Number //250
validationEvent : String/Boolean //KeyUP
value : Mixed
}
构造很麻烦的,但还好我们一般不会直接使用field
clearInvalid() : void
清除非法信息
getName() : String
getRawValue() : Mixed
getValue() : Mixed
isDirty() : void
isValid( Boolean preventMark ) : Boolean
markInvalid( String msg ) : void
reset() : void
setRawValue( Mixed value ) : void
setValue( Mixed value ) : void
validate() : Boolean
都很简单也略过了
事件
blur : ( Ext.form.Field this )
change : ( Ext.form.Field this, Mixed newValue, Mixed oldValue )
focus : ( Ext.form.Field this )
invalid : ( Ext.form.Field this, String msg )
specialkey : ( Ext.form.Field this, Ext.EventObject e )
valid : ( Ext.form.Field this )
Ext.form.Checkbox
继承自Field, 复选框
Checkbox( Object config )
构造,其中config{
autoCreate : String/Object,
boxLabel : String,
checked : Boolean,
fieldClass : String,//x-form-field
focusClass : String,
}
getValue() : Boolean
initComponent() : void
setValue( Boolean/String checked ) : void
事件
check : ( Ext.form.Checkbox this, Boolean checked )
Ext.form.Radio
继承自Ext.form.Checkbox,单选框
多了一个方法
getGroupValue() : String
如果单选框是一组radio 的一部分,取当前选中的值
Ext.form.Hidden
继承自Field,隐藏字段,无新特性
Ext.form.HtmlEditor
继承自Field,这个htmleditor功能太简单了,什么人能扩充一下就好了
config定义{
createLinkText : String //
defaultLinkValue : String // http://
enableAlignments : Boolean
enableColors : Boolean
enableFont : Boolean
enableFontSize : Boolean
enableFormat : Boolean
enableLinks : Boolean
enableLists : Boolean
enableSourceEdit : Boolean
fontFamilies : Array //这个当然要用汉字的字体组成的数组了
}
方法
cleanHtml( String html ) : void
createToolbar( HtmlEditor editor ) : void
execCmd( String cmd, [String/Boolean value] ) : void
getDocMarkup() : void
getToolbar() : Ext.Toolbar
insertAtCursor( String text ) : void
pushValue() : void
relayCmd( String cmd, [String/Boolean value] ) : void
syncValue() : void
toggleSourceEdit( [Boolean sourceEdit] ) : void
updateToolbar() : void
要提一点的是,要使用HtmlEditor,别忘了先Ext.QuickTips.init();
Ext.form.TextField
config{
allowBlank : Boolean //允许为空
blankText : String //如果为空验证错误时的提示文字 ,默认This field is required
disableKeyFilter : Boolean
emptyClass : String
emptyText : String
grow : Boolean // 自动生长?,如果需要,会加宽当前input type="text"
growMax : Number
growMin : Number
maskRe : RegExp //仅允许输入与maskRe匹配的按键
maxLength : Number
maxLengthText : String //超出最大长度时提示文本
minLength : Number
minLengthText : String //不够最小长度时提示信息
regex : RegExp //正则匹配
regexText : String //提示
selectOnFocus : Boolean
validator : Function //自定义验证方法,接受当前字段的值,如果合法,返回真,反之返回自定义信息
vtype : String //Ext.form.VTypes 中定义的vtype类型名,支持简单的类型验证
vtypeText : String//如果不是,则提示
}
方法:
TextField( Object config )
构造
autoSize() : void
自动尺寸
reset() : void
重置
selectText( [Number start], [Number end] ) : void
选择文本
validateValue( Mixed value ) : Boolean
验证值
对应一个dom中的form,默认是用ajax提交的,如果的确想回传,可以使用如下方式
var myForm. = new Ext.form.BasicForm("form-el-id", {
onSubmit: Ext.emptyFn,
submit: function() {
this.getEl().dom.submit();
}
});
方法:
BasicForm( Mixed el, Object config )
其中config配置为
{
baseParams : Object, //请求时的附加参数,格式为{id: '123', foo: 'bar'}
errorReader : DataReader, //提交时发生验证错误,这个dataReader将会被使用
fileUpload : Boolean, //支持文件上传
method : String, //GET或者POST
reader : DataReader, //load时使用的数据读取器
timeout : Number, //超时时间
trackResetOnLoad : Boolean,//支持使用reset方法恢复原始值
url : String //form要提交的url地址
}
add( Field field1, [Field field2], [Field etc] ) : BasicForm
增加字段field1,field2,etc
applyIfToFields( Object values ) : BasicForm
applyToFields( Object values ) : BasicForm
用传入的values呼叫Ext.applyIf/apply 方法
clearInvalid() : BasicForm
清除当前basicform中所有的非法信息
doAction( String/Object actionName, [Object options] ) : BasicForm
执行预定义的动作actionName,actionName类似"submit","load",也可以是自定义的动作的名字或一个Ext.form.Action的实例,options类似如下对象{
url :String,
method :String,
params :String/Object,
success :Function,
failure :Function,
clientValidation :Boolean
}
findField( String id ) : Field
在当前form中查找id/dataindex/name等于传入的id的field对象
getEl() : Ext.Element
得到当前form对象的element对象
getValues( Boolean asString ) : Object
得到当前form的fields {name:value,name:values}json对象,如果有同名多值,value将是一个数组
isDirty() : Boolean
从初始载入后,是否有field被修改过
isValid() : Boolean
客户端验证成功?
load( Object options ) : BasicForm
等效于doAction('load',options);
loadRecord( Record record ) : BasicForm
从一个record对象取值到当前basicform
markInvalid( Array/Object errors ) : BasicForm
标志非法,[{id:'fieldId', msg:'The message'},...]这样格式的数组或者{id: msg, id2: msg2}格式的对象
remove( Field field ) : BasicForm
从basicform中移除field
render() : BasicForm
在basicForm的fields中寻找,利用id属性检查他们,然后用id属性呼叫applyTo方法
reset() : BasicForm
重置所有值
setValues( Array/Object values ) : BasicForm
设置值,参见getValues
submit( Object options ) : BasicForm
提交表单
updateRecord( Record record ) : BasicForm
利用当前更新record对象,参见loadRecord
事件:
actioncomplete : ( Form. this, Action action )
actionfailed : ( Form. this, Action action )
beforeaction : ( Form. this, Action action )
Ext.form.Field
有了form之后,我们当然还需要field
方法:
Field( Object config )
其中config设置为{
autoCreate : String/Object, //一个{tag: "input", type: "text", size: "20", autocomplete: "off"}这样的对象,或者选 择true,就是前面所说的那个固定内置对象
clearCls : String, //,默认x-form-clear-left
cls : String, //默认样式
disabled : Boolean,
fieldClass : String //x-form-field
fieldLabel : String
focusClass : String //x-form-focus
hideLabel : Boolean //隐藏前导标签
inputType : String //input type="???"
invalidClass : String //x-form-invalid
invalidText : String
itemCls :String
labelSeparator : String //分隔符
msgFx : String
msgTarget : String
name : String
readOnly : Boolean
tabIndex : Number
validateOnBlur : Boolean //true
validationDelay : Number //250
validationEvent : String/Boolean //KeyUP
value : Mixed
}
构造很麻烦的,但还好我们一般不会直接使用field
clearInvalid() : void
清除非法信息
getName() : String
getRawValue() : Mixed
getValue() : Mixed
isDirty() : void
isValid( Boolean preventMark ) : Boolean
markInvalid( String msg ) : void
reset() : void
setRawValue( Mixed value ) : void
setValue( Mixed value ) : void
validate() : Boolean
都很简单也略过了
事件
blur : ( Ext.form.Field this )
change : ( Ext.form.Field this, Mixed newValue, Mixed oldValue )
focus : ( Ext.form.Field this )
invalid : ( Ext.form.Field this, String msg )
specialkey : ( Ext.form.Field this, Ext.EventObject e )
valid : ( Ext.form.Field this )
Ext.form.Checkbox
继承自Field, 复选框
Checkbox( Object config )
构造,其中config{
autoCreate : String/Object,
boxLabel : String,
checked : Boolean,
fieldClass : String,//x-form-field
focusClass : String,
}
getValue() : Boolean
initComponent() : void
setValue( Boolean/String checked ) : void
事件
check : ( Ext.form.Checkbox this, Boolean checked )
Ext.form.Radio
继承自Ext.form.Checkbox,单选框
多了一个方法
getGroupValue() : String
如果单选框是一组radio 的一部分,取当前选中的值
Ext.form.Hidden
继承自Field,隐藏字段,无新特性
Ext.form.HtmlEditor
继承自Field,这个htmleditor功能太简单了,什么人能扩充一下就好了
config定义{
createLinkText : String //
defaultLinkValue : String // http://
enableAlignments : Boolean
enableColors : Boolean
enableFont : Boolean
enableFontSize : Boolean
enableFormat : Boolean
enableLinks : Boolean
enableLists : Boolean
enableSourceEdit : Boolean
fontFamilies : Array //这个当然要用汉字的字体组成的数组了
}
方法
cleanHtml( String html ) : void
createToolbar( HtmlEditor editor ) : void
execCmd( String cmd, [String/Boolean value] ) : void
getDocMarkup() : void
getToolbar() : Ext.Toolbar
insertAtCursor( String text ) : void
pushValue() : void
relayCmd( String cmd, [String/Boolean value] ) : void
syncValue() : void
toggleSourceEdit( [Boolean sourceEdit] ) : void
updateToolbar() : void
要提一点的是,要使用HtmlEditor,别忘了先Ext.QuickTips.init();
Ext.form.TextField
config{
allowBlank : Boolean //允许为空
blankText : String //如果为空验证错误时的提示文字 ,默认This field is required
disableKeyFilter : Boolean
emptyClass : String
emptyText : String
grow : Boolean // 自动生长?,如果需要,会加宽当前input type="text"
growMax : Number
growMin : Number
maskRe : RegExp //仅允许输入与maskRe匹配的按键
maxLength : Number
maxLengthText : String //超出最大长度时提示文本
minLength : Number
minLengthText : String //不够最小长度时提示信息
regex : RegExp //正则匹配
regexText : String //提示
selectOnFocus : Boolean
validator : Function //自定义验证方法,接受当前字段的值,如果合法,返回真,反之返回自定义信息
vtype : String //Ext.form.VTypes 中定义的vtype类型名,支持简单的类型验证
vtypeText : String//如果不是,则提示
}
方法:
TextField( Object config )
构造
autoSize() : void
自动尺寸
reset() : void
重置
selectText( [Number start], [Number end] ) : void
选择文本
validateValue( Mixed value ) : Boolean
验证值
发表评论
-
itemselector-multiselect的数据过滤
2010-12-16 23:07 1869纠结了半天,重写不了方法,只好改源码了。 itemselect ... -
ExtJS DeskTop组件的学习
2010-12-12 23:02 2425网上千篇一律的 sample.js的代码解释。 //菜单里 ... -
[转载]Ext Ajax:如何调用Ext.Ajax.request方法和使用Java Servlet进行处理
2010-12-12 23:00 1311使用Ext.Ajax.request提交数据的代码如下(这段代 ... -
[转载]ExtJS中tabPanel的实现详解
2010-12-12 22:59 1795在做这项目有快一年了,有些体会想和大家分享分享,所以决定利用这 ... -
[转载]Ext中TreePanel控件和TabPanel控件搭配测试
2010-12-12 22:58 1020在实际的项目中,左边树形菜单,提供各种功能点击,右边一个面板, ... -
[转载]EXT核心API详解Ext.widgets(二十)-grid(2)
2010-12-12 22:57 1102Ext.grid.EditorGridPanel 可编辑数据表 ... -
[转载]EXT核心API详解Ext.widgets(十九)-grid(1)
2010-12-12 22:56 865Ext.grid.ColumnModel 用于定义Grid的列 ... -
[转载]EXT核心API详解Ext.Toolbar(十八)
2010-12-12 22:55 1385构造 add( Mixed arg1, Mixed arg2 ... -
[转载]EXT核心API详解Ext.menu.Menu(十七)
2010-12-12 22:55 1224Ext.menu.Menu 菜单对象 config{ ... -
[转载]EXT核心API详解Ext.widgets(十六)-form(下)
2010-12-12 22:54 912Ext.form.NumberField 继承自E ... -
[转载]EXT核心API详解Ext.widgets(十四)-Button,SplitButton,CycleButton
2010-12-12 22:53 894Ext.Action action实现一个脱离了容 器的事件, ... -
[转载]EXT核心API详解Ext.data(十三)-Tree/Node
2010-12-12 22:51 958Ext.data.Tree 继承自Observab ... -
[转载]EXT核心API详解Ext.data(十二)-GroupingStore/JsonStore/SimpleStore javascript
2010-12-12 22:51 846Ext.data.GroupingStore 继承自Ext.d ... -
[转载]EXT核心API详解Ext.data(十一)-Store
2010-12-12 22:50 732Ext.data.Store store是一个为Ext器件提 ... -
[转载]EXT核心API详解Ext.data(十)-DataReader/ArrayReader/JsonReader/XmlReader javascript
2010-12-12 22:49 880Ext.data.DataReader 纯虚类,从数据源得到 ... -
EXT核心API详解(九)-Ext.data-DataProxy/HttpProxy/MemoryProxy/ScriptTagProxy javascript
2010-12-12 22:48 1207Ext.data.DataProxy 数据代理类是一个纯虚类 ... -
[转载]EXT核心API详解(八)-Ext.dat-Connection/Ajax/Record javascript
2010-12-12 22:46 732Ext.data.Connection 访问指 ... -
[转载]EXT核心API详解(七)-Ext.KeyNav/KeyMap/JSON/Format/DelayedTask/TaskRunner/TextMetri
2010-12-12 22:46 778Ext.KeyNav Ext的keyNav类能为Ext.El ... -
[转载]EXT核心API详解(六)Ext.Fx
2010-12-12 22:45 724Ext.Fx类 对于我这样的 ... -
[转载]EXT核心API详解(五)Ext.EventManager/EventObject/CompositeElement/CompositeElementL
2010-12-12 22:44 805Ext.EventManager 事件管理者中的大部分方法都 ...
相关推荐
6. **EXT核心API详解Ext.widgets(十五)-form**: 这部分可能详细介绍了ExtJS的表单组件,包括如何创建表单、如何将表单数据提交到服务器、如何验证用户输入等。 7. **EXT核心API详解Ext.widgets(十八)-grid(1)**:...
EXTJS核心API详解是一系列详细解析EXTJS框架中关键组件和功能的文档。EXTJS是一个基于JavaScript的富客户端开发框架,用于构建交互式、数据驱动的Web应用。它提供了丰富的UI组件、强大的数据管理和网络通信机制,...
- **获取方法**:介绍了如何使用EXT提供的API来获取页面上的多个DOM节点。 - **应用场景**:适用于需要批量操作DOM元素的情况,如设置样式、绑定事件等。 #### 6. 响应事件 - **事件绑定**:详细讲解了如何使用EXT...
### Extjs核心API详解知识点概览 #### 一、Extjs简介与学习资源的重要性 - **Extjs**是一款基于JavaScript的开源前端框架,用于构建复杂的客户端应用程序。它提供了丰富的组件库以及强大的数据处理能力。 - **学习...
### EXT开发文档知识点详解 #### 一、EXT JS 概述 **EXT JS**,简称 **EXT**,是一个强大的 **JavaScript** 框架,它主要用于构建高度交互式的客户端应用程序。该框架支持多种Web标准,并且能够独立于服务器端技术...
### ext教程知识点详解 #### 一、概述 **ext** 是一个非常强大的 JavaScript 类库,最初它是基于 Yahoo UI 库开发的,但现在已经完全独立。它提供了丰富的组件和功能,适用于构建复杂的 Web 应用程序。 #### 二、...
### EXT中文教程知识点详解 #### 1. EXT简介 Ext 是一款基于 JavaScript 的开源前端框架,主要用于构建交互式 Web 应用程序。它提供了一系列丰富的 UI 组件和强大的功能,如表格、表单、菜单、工具栏等,帮助...
### Ext中文手册知识点详解 #### 1. **EXT简介** - **定义与背景**:Ext是一套基于JavaScript的用户界面库,它提供了丰富的组件和工具,帮助开发者快速构建高质量的Web应用程序。Ext最初由Extensible Software开发...
### Extjs4.0 学习指南核心知识点详解 #### 一、获取与安装Extjs4.0 **1.1 获取Extjs4.0** - **官方资源**: 访问官方网站 [http://extjs.org.cn/](http://extjs.org.cn/) 下载最新版本的Extjs4.0及相关文档和支持...
- **Element对象**:Ext的核心概念之一,用于操作DOM元素,提供了丰富的API来进行DOM操作,如获取、设置样式、位置等。 - **获取多个DOM的节点**:可以通过CSS选择器获取多个DOM节点,并进行批量操作。 - **响应...
### Extjs实用教程入门学习详解 #### 极致解析Extjs框架的核心价值与应用场景 **Extjs**,作为一款杰出的Ajax框架,以其强大的功能和灵活性,在Web开发领域占据了一席之地。它不仅能够帮助开发者构建出具备华丽...