View Full Version : Help adding records to JsonStore, sending to server

11 Aug 2009, 4:43 PM

I am using a Wizard (ext.ux.wizard) to collect information that will be used to create a new "Project" object on the server (using Json to communicate with Rails on the server side).

I have created the new JsonStore object and defined it's "fields" with the columns needed. I have collected the data fields entered by the user via the wizard. Now, I have an empty JsonStore that I need to add these user-entered data values into somehow (mystery #1), so I can ship it off to the server (mystery #2)...

I'm hung up trying to: 1) understand how to add these new "Records" (I think) to the JsonStore, and ensure that they match up correctly to the fields I've defined, and then 2) user the JsonStore object to format and send the data to the server.

var projectStore = new ww.RailsStore({
authToken: authToken, // required by Rails security
{name:'id', type:'string'},
{name:'name', type:'string'},
{name:'email', type:'string'},
{name:'projecttype', type:'string'},
{name:'projectstatus', type:'string'},
{name:'updated_at', type:'string'},
{name:'created_at', type:'string'}

// onFinish fires when the user hits "Finish" button in the wizard
onFinish : function()
// Save the Project definition to Rails
var wizardData = this.getWizardData(); // contains the user-entered data items

var fields = projectStore.fields; // mixed collection of fields (no data yet)
// I can see in Firebug these field definitions are correct. This seems like "schema"
// information about the columns of each row of data, if I'm following this right

// Mystery #1 - how to populate the JsonStore with the user's data
// Copy wizard data into project store - how do I add wizard data items to store?

// Mystery #2 - how to trigger JsonStore into sending Json data to server
// opposite of load()
// How do I save JsonStore contents to server?

Apologies in advance as this is probably a simple, newbie question, but most of the examples do a great job explaining how to use a JsonStore to load data from the server into a grid... haven't found any for creating new data by user and using JsonStore to send to the server.

I must be missing something fundamental here about using the JsonStore for "sending" instead of "receiving"...

Many thanks in advance for the assist.


11 Aug 2009, 4:45 PM
Have a look at the writer example that comes with the 3.0 download, should get you pointed in the right direction.

11 Aug 2009, 5:30 PM
Thanks Evan. This provides a good example for the "JsonWriter" piece (mystery #2) and is a step in the right direction, for sure...

My "Mystery #1" remains, though, as it's unclear how to go about adding non-form items (records) to the store in a way that causes them to mesh up with the "field" definitions. In other words, do the "fields" even matter -or- is it the naming of the "record" objects that determine what gets Json-encoded and sent to the server by the writer?


11 Aug 2009, 8:35 PM
OK. I found another example that provides the missing link (Mystery #1):

var u = new store.recordType({
first : 'Rick',
last: 'Braddy',
email : '[email protected]'

store.insert(0, u);

I'm guessing that the recordType() function creates a proper record structure based on the store's "schema", as defined by its "fields"... (just takes a while to figure all this stuff out, as the conceptual level information on ExtJS isn't always readily available or obvious).

This example cleared it up for me, in case someone else is looking for these same answers:




11 Aug 2009, 9:54 PM
Here's the final code that's working (without the changes to the JsonStore to add the Ext.data.Writer, which is coming next):

onFinish : function()
// Save the Project definition to Rails
var wizardData = this.getWizardData(); // get saved wizard data
var projectStore = theStores.projectStore; // get project store

// Copy wizard data into project store
var projemail = wizardData.projectemails.email;
var projname = wizardData.projectname.name;
var projtype = wizardData.projecttype.type;
var projstatus = 'in-progress';

// Create new project record with these user settings
var rec = new projectStore.recordType({
id : '0',
name : projname,
email : projemail,
projecttype : projtype,
projectstatus : projstatus
projectStore.insert(0, rec); // insert new record in store

// *** Ship off to the the server (via store data Writer - COMING SOON) ***

// Activate the next wizard tab in the sequence

Case closed.



11 Aug 2009, 10:42 PM
FYI you're still looking at RC2, the final version was released a while ago.