`

EXT核心API详解(十五)_Ext.form.BasicForm/Field/Checkbox/Radio/Hidden/HtmlEditor

阅读更多
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核心API详解

    EXT核心API详解 1、Ext类 ………………………………… 2 2、Array类 …………………………… 4 3、Number类 …………………………… 4 4、String类 …………………………… 4 5、Date类 ……………………………… 5 ...

    Ext Js权威指南(.zip.001

    Ex4.0共2个压缩包特性,《ext js权威指南》 前 言 第1章 ext js 4开发入门 / 1 1.1 学习ext js必需的基础知识 / 1 1.2 json概述 / 3 1.2.1 认识json / 3 1.2.2 json的结构 / 3 1.2.3 json的例子 / 4 1.2.4 ...

    ext checkboxgroup 回填数据解决

    重写 代码如下: //解决checkboxgroup回填数据问题 Ext.override(Ext.form.BasicForm,{ findField : function(id){ var field = this.items.get(id); if(!field){ this.items.each(function(f){ if(f.isXType(...

    ExtJS入门教程(超级详细)

    45、Ext.form.Field类 …………………… 41 46、Ext.form.Checkbox类 …………… 42 47、Ext.form.Radio类 ………………… 43 48、Ext.form.HtmlEditor类 …………… 43 49、Ext.form.TextField类 …………… 44 50...

    ExtJs实现数据加载和提交经典代码

    FormPanel中的 form对象为Ext.form.BasicForm类型的对象,它有load和submit方法分别用于加载数据和提交数据。而这两个方法都是通过调用 Ext.form.BasicForm中的doAction方法来操作的。doAction方法带有两个参数,...

    Extjs学习笔记之二 初识Extjs之Form

    Extjs中的表单组件是Ext.form.BasicForm,不过最简单最常用的是Ext.form.FormPanel控件,它继承自Panel,具有一定的界面显示控制能力,它其中包含着一个BasicForm对象,用来执行向服务器提交,加载等动作。...

    深入浅出ExtJS第2版

    1.2 如何查看EXT自带的API和示例 1 1.3 为什么有些示例必须放在服务器上 才能看到效果 2 1.4 Hello World 2 1.4.1 直接使用下载的发布包 2 1.4.2 在项目中使用EXT 3 1.5 为什么页面提示"找不到图片" 3 1.6 ...

    basicform

    基本形式mvn全新安装复制tomcat / webapps目录中的target / basicform.war文件。

    reactive-templates:创建可以在meteor 中覆盖的模板

    React式模板 设置模板并以React方式覆盖它们。 这允许流星包作者使他们的模板可覆盖。... request ( 'contactForm' , 'basicForm' ) // Basic form is the name of the default template we will create la

    Basicform:非常基本HTMLCSS旅行表单

    基本形式一个非常基本的html表单

Global site tag (gtag.js) - Google Analytics