How do I submit a form using a store under ExtJs?

Question

Is there a way to have a form submit create an object in a store under ExtJs 4?

It seems strange to me that the grid is built completely around the store mechanism and I see no obvious way to plug a form into a store. But I am most likely just missing something.

Answer 1

You can add a model instance to a store upon form submit using this code:

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

    iStore.add( iValues );
},

This is within an MVC controller, so this is the controller.

For model editing, you can 'bind' a form to a model instance using loadRecord:

iFormPanel.loadRecord( this.selection );

You can then update the model instance using updateRecord():

iFormPanel.getForm().updateRecord();

Just for fun (and as it might help some), it is similar to the following code:

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

    iRecord.set ( iValues );        
},

If your store is has autoSync: true. An Update (or Create) call will be made via the configured proxy. If there's no autoSync, you'll have to sync your store manually.