在ExtJS的4加载和保存嵌套数据 [英] Load and save nested data in ExtJS 4

查看:135
本文介绍了在ExtJS的4加载和保存嵌套数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有两个型号:书作者的belongsTo。我们的调查与图书数据一起发送的道路上从服务器到ExtJS的和后面的作者的数据。服务器发送嵌套的数据如下,以ExtJS的:

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',
    }
  }
}

在ExtJS的一侧的数据由下面的模型进行处理:

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', 
    }]    
});

由于映射 Author.id AUTHOR_ID 图书领域模式( {名称:'AUTHOR_ID',映射:Author.id'} )我能够笔者将数据加载到下面的表单设计编辑的书数据:

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).

现在的问题来了:我会选择从组合一些其他的作者,我会保存表单。正如书中记录变脏( AUTHOR_ID 现在显示为一个图书示范田),有将提高到一个请求我的/书籍/更新 URL(这是相当好的,我'编辑书)与下列发送到服务器的数据:

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
  }
}

数据回来服务器未中相同的结构,因为它们已被送往ExtJs的,且必须做出某种像翻译

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']);

我问:是否有可能把这样的方式,他们将回到服务器只是在相同的结构,因为他们从服务器附带由ExtJS的表单数据?怎么样?

这个问题已经讨论过不知何故<一个href=\"http://stackoverflow.com/questions/14634577/save-nested-form-data-back-to-server-in-extjs\">here, 这里和的这里,但既不是这些讨论的肯定回答了。

This question was already somehow discussed here, here and here, but neither of those discussions answered it definitely.

感谢提前帮助! :)

推荐答案

简短的回答:不,还没有。

Short Answer: No, not yet.

更长的答案:你可以创建自己的作家来处理你的数据结构,当你收到它发回服务器以同样的方式。

Longer answer: You could create your own writer to handle your data structure and send it back to the server the same way as you received it.

您既可以通过创建子类自己的作家:的 http://docs.sencha.com/ext-js/4-2/#!/api/Ext.data.writer.Writer 和使用,在你的代理

You could either create your own writer by subclassing: http://docs.sencha.com/ext-js/4-2/#!/api/Ext.data.writer.Writer and use that in your proxy

您可以创建,改变它的结构,在模型上的功能。
既然你不使用的商店,你可以创建一个函数saveModel(),您改变模型结构和调用save()方法。

You could create a function on your model that changes it's structure. Since you are not using stores you could create a function saveModel() where you change the model structure and call the save() method.

这篇关于在ExtJS的4加载和保存嵌套数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆