title: Updating associated records in EXTJS
body: <p>I am working on a master slave detail page in extjs 4.1.1 .</p>
  
  <p>I have a Person model who hasMany Address models.
  (I've configured the relationships in EXTJS)</p>
  
  <p>I have a grid that displays all the person records, and when I click on a record, I show the related addresses of this person in another grid.</p>
  
  <p>To populate the second grid I use:</p>
  
  <pre><code>var grid2 = this.getAddressList(); //made a reference to this
  var store = record.Addresses(); // this gives me the addresses store associated with the person record
  ...
  grid2.reconfigure(store);
  </code></pre>
  
  <p>Now when I add an address to the person's address store, an ajax request fires off to the rest server.
  To make sure extjs would also send the associated data to the server I created a special writer class (code from extjs forums).</p>
  
  <pre><code>Ext.define('Ext.data.writer.DeepJson', {
  extend:'Ext.data.writer.Json',
  getRecordData:function (record, operation) {
      var isPhantom = record.phantom === true,
          writeAll = this.writeAllFields || isPhantom,
          nameProperty = this.nameProperty,
          fields = record.fields,
          data = {},
          changes,
          name,
          field,
          key;
  
      if (writeAll) {
          // This is the branch that has been changed from the original Json Writer
          data = record.getData(true);
      } else {
          changes = record.getChanges();
          for (key in changes) {
              if (changes.hasOwnProperty(key)) {
                  field = fields.get(key);
                  name = field[nameProperty] || field.name;
                  data[name] = changes[key];
              }
          }
      }
      if (isPhantom) {
          if (operation &amp;&amp; operation.records.length &gt; 1) {
              data[record.clientIdProperty] = record.internalId;
          }
      } else {
          data[record.idProperty] = record.getId();
      }
  
      return data;
  }
  });
  </code></pre>
  
  <p>At the server side it just updates the database and then sends me back the person with his associated addresses in a json object so that extjs can update the front end.</p>
  
  <p>The problem is that extjs is only able to update the person grid but not the address grid.
  The newly created address record stays marked as dirty even though the server did respond with the updated version of the record (the server gave it an id)</p>
  
  <p>Is there anyone who has come across something similar and could offer me some advice?
  I realise that I did not provide a lot of code but I'm willing to share more, I just wouldn't know what pieces are needed.</p>
  
  <p><strong>EDIT</strong>
  I load the data in to the grid by using MyStore.load()
  The store has a rest proxy configured like so:</p>
  
  <pre><code>proxy:
      {
          type: 'rest',
          url: 'persons', //general read url
          headers : auth, //basic auth to connect to rest service
          reader:
          {
              type: 'json',
              root: 'persons',
              successProperty: 'renderList'
          },
  
          writer:Ext.create('Ext.data.writer.DeepJson', {root: 'persons'}), //above writer class
          api:
          {
              update: 'persons/person',
              create: 'persons/person',
              destroy: 'persons/person'
  
          },
      }
  </code></pre>