Skip to content

error after collection.fetch because the cache isn't updated #471

@wvengen

Description

@wvengen

I have a situation where the CollectionStore doesn't seem to be updated.

In a search box, I'm updating the search results in-place as follows:

module.exports = BaseView.extend({
  'events': {
    'change .search-input': 'onSearch',
    'keyup .search-input':  'onSearchTyped'
  },

  getTemplateData: function() {
    data.collection = this.collection;
  },

  onSearchTyped: _.debounce(function() {
    this.onSearch();
  }, 1200),

  onSearch: function() {
    var params = { q: this.$el.find('.search-input').val() };
    this.collection.fetch({
      data: params,
      reset: true,
      success: function(collection, response, options) {
        var url = '/foobars?' + this.$el.find('form').serialize();
        this.app.router.navigate(url);
        this.render();
      }
    });
  }
});

When text is entered in the search input, the new collection is fetched and the view's collection is updated. However, at some point an exception is thrown:

Error: Collection of type "Foobars" not found for params: {q: "foo"}

Debugging revealed that the fetch was not (yet?) stored in the collection store's cache. When adding this line at the top of the success function, it all works:

this.app.fetcher.collectionStore.set(collection, params);

It seems odd that I need to add something to the cache manually here. Is this a bug, or am I doing something that really isn't intended?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions