I have two models: Book belongsTo Author. Let's survey the author data sent together with book data on its way from server to ExtJs and back. Server sends following nested data to ExtJs:
{
success : true,
data: {
id: '23',
name: 'JavaScript - The definitive guide'
author: { // <<-- nested author data
id: '45',
name: 'David Flanagan',
}
}
}
On side of ExtJs the data are treated by following model:
Ext.define('My.models.Book', {
extend: 'Ext.data.Model',
idProperty: 'id',
fields: [
'id',,
'name',
{name: 'author_id', mapping: 'Author.id'}, // <<-- flat author data
],
proxy: {
type: 'ajax',
api: {
read: 'My/Books/index',
create: 'My/Books/create',
update: 'My/Books/update',
destroy: 'My/Books/delete'
},
reader: {
type: 'json',
root: 'data',
},
writer: {
type: 'json',
root: 'data',
},
},
associatinons: [{
type: 'belongsTo',
model: 'My.models.Author',
associationKey: 'Author',
}]
});
Thanks to mapping Author.id
on author_id
field of Book
model ({name: 'author_id', mapping: 'Author.id'}
) I am able to load the data of author to following form designed to edit book data:
Ext.define('My.views.books.Form', {
extend: 'Ext.form.Panel',
initComponent: function () {
var me = this;
me.items = [{
xtype: 'container',
layout:'anchor',
defaults:{
anchor: '95%'
},
items:[{
xtype: 'textfield',
fieldLabel: 'Book title',
name: 'name'
},{
xtype: 'combo',
fieldLabel: 'Author',
name: 'author_id', // <<-- flat author data
store: ...
}]
}];
me.buttons = [{
text: 'Save',
scope: me,
handler: me.onSave
}];
me.callParent(arguments);
},
...
});
Of course there is a model dedicated exclusively to author but when I need to load book and author data into one form at once, I do not see (for the moment) other possibility as the one shown above (Of course show me it, please, if there is some better solution).
The problem comes now: I will choose some other author from combo and I will save the form. As the book record get dirty (author_id
appears now as a Book
model field), there will be raised a request to 'My/Books/update'
URL (this is quite ok, I'am editing book) with following data sent to server:
{
data: {
id: '23',
name: 'JavaScript - The definitive guide',
author_id: '78' // <<-- flat author data
}
}
Data coming back to server are not the in the same structure as they have been sent to ExtJs and must make some kind of translations like:
$data['Author']['id'] = @$data['author_id'];
unset($data['author_id']);
I am asking: Is it possible to treat data by ExtJs form in such a way that they will get back to server just in the same structure as they came from server? HOW?
This question was already somehow discussed here, here and here, but neither of those discussions answered it definitely.
Thank in advance for help! :)