Reading an array property from a store record

[reselbob]

Hi:

I have a datagrid, FathersDataGrid that displays JSON records, in which a record's schema is:

firstName - string
lastName - string
dob - data
children - array [{firstName, lastName, dob}]

I load all the records using store, FathersStore, that is bound to a model, FatherModel, with a REST Proxy.

I display firstName, lastName, dob into the FathersDataGrid. When I select a row in FathersDataGrid, I want to load another datagrid that shows rows of a particular father's children. When I select a row on FathersDataGrid I want to program the event handler to use the data that is in FathersStore, with no server rountrip. And, when I add a child to a father, I want to update the the data server using FatherModel.save().

Here is my question: is it possible to display the children from the FathersStore/FatherModel into the second datagrid, without a server callback, and add a child to the FatherStore using the REST Proxy attached to FatherModel?

In other words, I want NO server callback when reading from a father record to display children. Yet, I want to callback to the server when adding a child to the father record. (I figure I can just call FatherStore.load() to refresh the FathersDataGrid.)

I hope I did a good job of explaining my problem. If clarification is required, please do not hesitate to let me know.

Thanks in advance,
Bob

[mitchellsimoens]

Sure, you can create the grid and create a store for it providing the data from the children field. If you add a record to the new store you would need to also add to the record from the main store.

[James Goddard]

You want to create two models:

1. Father
2. Child

In your Father model add a HasMany association with child. I.E. Father has many child.

hasMany:{model:'Child', name:'chidren'}

[Optional: In your Child add a BelongsTo association with Father.]

This will assume your JSON data for the father call looks something like:

[{
  name: 'Fred',
  spouse: 'Wilma',
  children: [{
    name: 'Pebbles'
  }]
}]

When you click on a Father in the Fathers grid you will do a bind store on the Childrens grid using record.children (). For Example:

onItemClick: function (grid, record, item) {
 this.childrenGrid.bindStore (record.children ());
}

When you add or edit a child, do it in the "children ()" store of the father record. Saving the father record or synching the father store will then send your changes back to the server.