Ext.form.Panel主要用于表单的提交,但由于form panel可以和record绑定,
一般和list结合使用,用于详细显示list的一条记录。
如list的itemtap事件,第四个参数就是该record,可以直接将该record set到form panel上
itemtap( Ext.dataview.DataView this,
Number index,
Ext.Element/Ext.dataview.component.DataItem target,
Ext.data.Model record,
Ext.EventObject e, Object eOpts )
setRecord( Ext.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)
}
},