如何使用 ExtJS 中的表单更新商店？答案

【问题标题】：How to update a store with a form in ExtJS?如何使用 ExtJS 中的表单更新商店？
【发布时间】：2015-05-29 19:56:17
【问题描述】：

我有商店，我用这段代码添加了一条新记录。首先它添加新记录，然后同步到后端。

Ext.getStore('ilhan').add(Ext.getCmp('contacForm').getValues());
Ext.getStore('ilhan').sync({
    success: function(){
        Ext.getStore('ilhan').load();
        Ext.getCmp('customerWindow').close();
    }
});

我也可以使用下面的代码删除一条记录。

Ext.getStore('ilhan').remove(Ext.getCmp('theGrid').getSelectionModel().getSelection()[0]);
Ext.getStore('ilhan').sync({
    success: function(){
        Ext.getStore('ilhan').load();
    }
});

但我不知道如何更新记录。我只能用网格行中的数据填写表格。

Ext.getCmp('contacEditForm').getForm().setValues(Ext.getCmp('theGrid').getSelectionModel().getSelection()[0].data);

那么，我有 add 和 remove 存储方法，但我没有任何 update 方法？我应该如何更新商店？

【问题讨论】：

标签： javascript extjs extjs5 extjs-stores

【解决方案1】：

看看你的记录。查看“脏”属性是否为真。这就是代理用来确定一条记录是 post 还是 put。

【讨论】：

【解决方案2】：

更新。

var form = Ext.getCmp('contacForm'),
    record = form.getRecord(),
    values = form.getValues(),
    store = Ext.getStore('ilhan');
record.set(values);
store.sync({
    success:function() {
        store.load()
    }
});

【讨论】：

【解决方案3】：

我建议使用Model。

Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: ['id', 'name', 'email'],

    proxy: {
        type: 'rest',
        url : '/users'
    }
});

创建：

var user = Ext.create('User', {name: 'Ed Spencer', email: 'ed@sencha.com'});

user.save(); //POST /users

加载：

//Uses the configured RestProxy to make a GET request to /users/123
User.load(123, {
    success: function(user) {
        console.log(user.getId()); //logs 123
    }
});

更新：

//the user Model we loaded in the last snippet:
user.set('name', 'Edward Spencer');

//tells the Proxy to save the Model. In this case it will perform a PUT request to /users/123 as this Model already has an id
user.save({
    success: function() {
        console.log('The User was updated');
    }
});

删除：

//tells the Proxy to destroy the Model. Performs a DELETE request to /users/123
user.erase({
    success: function() {
        console.log('The User was destroyed!');
    }
});

【讨论】：