mardi 16 septembre 2014

Data binding form fields

How can i show attributes of selected model in form field in tabpanel?

DetailView



Code:



Ext.define('Test.view.ResultView', {
extend: 'Ext.tab.Panel',
alias: 'widget.resultView',
requires: [
'Ext.tab.Bar',
'Ext.XTemplate',
'Ext.Button',
'Ext.Spacer',
'Ext.form.FieldSet',
'Ext.form.Panel',
'Ext.field.Spinner',
'Ext.field.DatePicker',
'Ext.picker.Date',
'Ext.Button',
'Ext.field.TextArea',
'Ext.field.Radio',
'Ext.Container',
'Test.model.car'
],
config: {
xtype: 'resultView',
itemId: 'resultView',
tabBar: {
docked: 'top',
ui: 'neutral',
layout: {
type: 'hbox',
pack: 'center'
}
},
items: [
{
xtype: 'container',
title: 'Result Info',
id: 'resultTab',
scrollable: true,
items: [
{
xtype: 'fieldset',
itemId: 'fieldset',
title: 'Result',
items: [
{
xtype: 'textfield',
label: 'Name',
name: 'id',
id: 'id',
value: '{id}'
}
]
}
]
}
]
}

});

ListController


Code:



Ext.define('Test.controller.CarListCont', {
extend: 'Ext.app.Controller',
config: {
refs: {
loginView: 'loginView',
mainView: 'mainView',
resultView: 'resultView'
},
control: {
"mainView #carListView list": {
select: 'onSelect'
}
},
stores: [
'CarStore'
],
models: [
'Car'
]

},
onSelect: function(list, record, target, index, e, eOpts) {
var id = record.get('id'),
resultView= Ext.create('widget.resultView');

resultView.setData(record.data);

// Navigate to details
this.getMainView().push({
xtype: "resultView",
record: record,
data: record.data
});
}
});

ResultController


Code:



Ext.define('Test.controller.resultCont', {
extend: 'Ext.app.Controller',
config: {
refs: {
resultView: 'resultView',
panel: 'resultView #resultTab #fieldset'

},
control: {
resultView: {
show: 'initWork'
}
}
},
initWork: function() {
var data = this.getResultView().getData();
if (data !== null) {
console.log(data.id);
var uu = this.getPanel().down('#id');
var id = data.id;
console.log(id);
uu.setValue(id);
}
}
});





Data binding form fields

Aucun commentaire:

Enregistrer un commentaire