[轉載]EXT核心API詳解Ext.widgets(十五)-form(上)

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
驗證值 
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章