CODEWITHSUNDEEP
javascriptextjsextjs5extjs-stores
ilhan
ilhan

Reputation: 8995

How to update a store with a form in ExtJS?

I have store and I add a new record with this code. First it adds the new record and then it synchronizes to the back-end.

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

I can also delete a record with this code below.

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

But I don't know how to update a record. I can only fill up the form with the data from the row of the grid.

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

So, I have add and remove methods for store but I don't have any update method? How I'm supposed to update the store?

Upvotes: 2

Views: 10602

Answers (3)

ajokn
ajokn

Reputation: 131

I suggest using Model. 

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

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

Create:

var user = Ext.create('User', {name: 'Ed Spencer', email: '[email protected]'});

user.save(); //POST /users

Load:

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

Update:

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

Delete:

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

Upvotes: 4

bakamike
bakamike

Reputation: 1024

To update.

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

Upvotes: 2

Joey
Joey

Reputation: 477

Look at your record. See if the 'dirty' property is true. That's what the proxies use to determine if a record is a post or a put.

Upvotes: 1

Related Questions