Load form from combo - combobox

Question

I'm trying to load a form from a record selected in a combo.
The store is loaded properly and the combo is populated, but, when I select a value from combo, form fields remain empty.
Any help will be appreciated.
This is the code:
Model:
Ext.define('AA.model.proc.Process', {
extend: 'Ext.data.Model',
fields: [
{ name: 'name', type: 'string' },
{ name: 'owner', type: 'string' },
{ name: 'mail_dest', type: 'string' }
],
proxy: {
type: 'rest',
url : 'data/camp.json',
reader: {
type: 'json',
root: 'camp',
totalProperty: 'count'
}
}
});
Store:
Ext.define('AA.store.proc.Process', {
extend: 'Ext.data.Store',
model: 'AA.model.proc.Process',
requires: 'AA.model.proc.Process'
});
Class:
Ext.define('AA.view.proc.IM', {
extend: 'Ext.window.Window',
alias: 'widget.im',
title: 'IM',
layout: 'fit',
height: 500,
width: 400,
autoShow: true,
plain: true,
modal: true,
headerPosition: 'right',
closable: false,
initComponent: function () {
this.items = [{
xtype: 'form',
fileUpload: true,
width: 550,
autoHeight: true,
border: false,
bodyStyle: 'padding:5px 5px 0',
frame: true,
labelWidth: 100,
defaults: {
anchor: '95%',
allowBlank: false,
msgTarget: 'side'
},
items: [{
xtype: 'combo',
name: 'name',
store: 'procstore',
fieldLabel: 'Name',
valueField: 'name',
displayField: 'name',
width: 150,
allowBlank: true,
listeners: {
scope: this,
'select': this.loadForm
}
}, {
xtype: 'textfield',
fieldLabel: 'Name',
name: 'name'
}, {
xtype: 'textfield',
fieldLabel: 'Owner',
name: 'owner'
}, {
xtype: 'textfield',
fieldLabel: 'E-mail owner',
name: 'mail_dest'
}]
}];
this.buttons = [{
text: 'Save',
action: 'save'
}, {
text: 'Cancel',
scope: this,
handler: this.close
}];
this.callParent(arguments);
},
loadForm: function (field, record, option) {
console.log(record)
// firebug returns
// $className "AA.model.proc.Process"
// $alternateClassName "Ext.data.Record"
console.log(this.down('form'))
// firebug returns the right form panel
this.down('form').loadRecord(record);
}
});

Answer 1

This is from the documentation for the select event:
select( Ext.form.field.ComboBox combo, Array records, Object eOpts )
Notice that the second parameter is an Array. But in your example the second parameter is an Ext.data.Record. You are treating array as a record. Modify your loadForm to make it process arrays of records:
loadForm: function (field,records,option) {
this.down('form').loadRecord(records[0]);
}
P.S. By the way you have two fields with name: 'name'.