store values from form to grid

I have create a add record form in extjs which stores user entered data into grid.

Well , if found following method to get form values from formPanel

var formPanel = new Ext.form.FormPanel({...});
var form = formPanel.getForm();
var firstName = form.findField('firstname').getValue();

but i want to covert all the user input value into JSON and want to store into Grid panel and want to send it to the server also. but using findField i have to manually create the array and then need to encode it into JSON , so i开发者_开发问答s there any alternate way to directly read values from form and convert it into JSON and store it into Grid Panel.

---

When you say "want to store in the GridPanel" would you be updating an existing record in the Grid's store or would you be inserting a new one or both? (depending on whether its add or update probably?)

For such situations, BasicForm (var form in your snippet above) provides updateRecord( Record record ) method.

So your steps would be -

var record = Record.create(...) // in case of insert

OR

var record = //obtain record from grid.getStore() in case of update

Then,

formPanel.getForm().updateRecord(record); //update the passed record with values from the form

Followed by committing the record back to the store-

grid.getStore().add(record); //in case of insert
grid.getStore().commitChanges(); //incase of update

Reference - Ext.form.BasicForm , Ext.data.Record

Define your record type -

MyRecordType = Ext.data.Record.create(['id', 'field1', 'field2']);

var myrec = new MyrecordType();

Now pass myrec to updateRecord as mentioned above.