6

有没有办法让表单提交在 ExtJs 4 下的商店中创建对象？

网格完全围绕存储机制构建对我来说似乎很奇怪，我看不到将表单插入存储的明显方法。但我很可能只是错过了一些东西。

4

2 回答 2

13

您可以使用以下代码在表单提交时将模型实例添加到商店：

onSaveClick: function()
{
    var iForm         = this.getFormPanel().getForm(),
        iValues       = iForm.getValues(),
        iStore        = this.getTasksStore();

    iStore.add( iValues );
},

这是在 MVC 控制器内，控制器也是如此this。

对于模型编辑，您可以使用以下方法将表单“绑定”到模型实例loadRecord：

iFormPanel.loadRecord( this.selection );

然后，您可以使用以下方法更新模型实例updateRecord()：

iFormPanel.getForm().updateRecord();

只是为了好玩（并且可能对某些人有所帮助），它类似于以下代码：

onSaveClick: function()
{
    var iForm         = this.getFormPanel().getForm(),
        iRecord       = iForm.getRecord(),
        iValues       = iForm.getValues();

    iRecord.set ( iValues );        
},

如果您的商店有autoSync: true. 将通过配置的代理进行更新（或创建）调用。如果没有自动同步，您必须手动同步您的商店。

于 2012-08-06T21:04:16.193 回答
3

您可以继承 Ext.form.action.Action 来为要在 Store 上执行的表单提供加载/保存操作。唯一的问题是在 Ext.form.Basic 中没有“官方”的方式来选择任何非标准的操作，所以我建议一个非官方的覆盖：

Ext.define('Ext.form.Advanced', {
    override: 'Ext.form.Basic',

    submit: function(options) {
        var me = this,
            action;

        options = options              || {};
        action  = options.submitAction || me.submitAction;

        if ( action ) {
            return me.doAction(action, options);
        }
        else {
            return me.callParent(arguments);
        }
    },

    load: function(options) {
        var me = this,
            action;

        options = options            || {};
        action  = options.loadAction || me.loadAction;

        if ( action ) {
            return me.doAction(action, options);
        }
        else {
            return me.callParent(arguments);
        }
    }
});

并且，在创建了您需要的操作之后，您可以在表单面板中使用它们：

Ext.define('My.form.Panel', {
    extend: 'Ext.form.Panel',

    requires: [ 'Ext.form.Advanced' ],

    loadAction: 'My.load.Action',
    submitAction: 'My.submit.Action',

    ...
});

不过还有其他方法和捷径。

于 2012-08-06T21:45:28.190 回答