How do I reload data for just one item in my store?

I have a list of items in a store that I hit on my API endpoint like so:

http://myapi.com/things.json

When I navigate to this item I'd like to be able to either give the user a chance to reload the data (from the API) manually, or do it automatically myself.

Is this possible with Sencha? How can I accomplish this?


Additionally, if I hit the single URL for one of these things like:

http://myapi.com/things/1.json

...it returns associated nested data. I'd like to reload this associated data as well.

I can't find a "reload", "refresh", "load", or any other type of method that will allow me to do this in the Model API.

Help?

I've been googling and API diving for the better part of 6 hours now trying to figure out how to do this. All I've found are a bunch of unanswered forum questions.

Is this really impossible with the current API?

Right now I'm wondering if simply loading a single item from my model, then replacing the current one in the store is the best solution. This seems like a huge hack workaround.

Has nobody had the need to do this before?

Screw it...hacked together a 'reload' method that will reload item data from its single endpoint, along with JSON associations.

Here goes for anyone that runs into the same issue, which I suspect will be A LOT OF PEOPLE.

Code:

---

Ext.define('CbMobile.model.Base', {
  extend: 'Ext.data.Model',


  // Reloads a single object's data, including assocations.
  reload: function(config, scope) {
    var me = this;
    var proxy = me.getProxy(),
      idProperty = me.getIdProperty(),
      record = null,
      params = {},
      id = me.getId(),
      callback,
      operation;


    scope = scope || (config && config.scope) || me;
    if (Ext.isFunction(config)) {
      config = {
        callback: config,
        scope: scope
      };
    }


    params[idProperty] = id;
    config = Ext.apply({}, config);
    config = Ext.applyIf(config, {
      action: 'read',
      params: params
    });


    operation  = Ext.create('Ext.data.Operation', config);


    if (!proxy) {
      Ext.Logger.error('You are trying to reload a model that doesn\'t have a Proxy specified');
    }


    callback = function(operation) {
      if (operation.wasSuccessful()) {
        record = operation.getRecords()[0];
        me.beginEdit();
        me.set(record.data);
        me.endEdit(true);
        me.commit();
       
        // Have to read the raw data for associations from response,
        // because it's not returned or decoded in the 'record' for some stupid reason.
        var response = operation.getResponse();
        var responseRawJson = Ext.JSON.decode(response.responseText);
        me.handleInlineAssociationData(responseRawJson);
       
        Ext.callback(config.success, scope, [record, operation]);
      } else {
        Ext.callback(config.failure, scope, [record, operation]);
      }
      Ext.callback(config.callback, scope, [record, operation]);
    };
    proxy.read(operation, callback, me);
  }
 
});

---

Thanks for the code. I'm also surprised this isn't already in the framework.

Hey subimage, how is your reload method different from the load method on the Model class?