现在的位置: 首页 > 综合 > 正文

Sencha Touch之Ext.form.Panel的用法

2012年08月14日 ⁄ 综合 ⁄ 共 930字 ⁄ 字号 评论关闭

Ext.form.Panel主要用于表单的提交,但由于form panel可以和record绑定,

一般和list结合使用,用于详细显示list的一条记录。

如list的itemtap事件,第四个参数就是该record,可以直接将该record set到form panel上

itemtapExt.dataview.DataView this, 

             Number index, 

             Ext.Element/Ext.dataview.component.DataItem target, 

             Ext.data.Model record,

             Ext.EventObject e, Object eOpts )

setRecordExt.data.Model instance ) 

当在form panel上修改某个值时,如何放映到record上呢?

直接的方法是当要submit时通过getValues()方法拿到页面上的值,再set到record上。

但有一种更简便的方法,可以不用getValues取值,通过给每个item添加change listener,时时更新record,

也就是说每当用户有更改时,就刷新record.同时,也可以在此时让save按钮等显示。

addListenerToItems : function(){

    var items = this.getFormPanel().getItems();

    for(var i=0;i<items.length;i++){
        //add listener on each field to update the model as soon as the fiels is changed
        items.items[i].on('change',this.updateRecord,this);
    }

}

 updateRecord : function(field,newValue,oldValue){

    var record = this.getFormPanel().getRecord();
    if(record){
        record.set(field.getName(), newValue)
    }
},

抱歉!评论已关闭.