Huehnermelker
Huehnermelker

Reputation: 13

Ember: View is not updating after request, when using RESTAdapter

As starting point we used http://todomvc.com/architecture-examples/emberjs/ . We changed the FixtureAdapter to a RESTAdapter and performed the following changes:

Todos.TodosActiveRoute = Ember.Route.extend({
  model: function(){
    // ** OLD CODE **
    // return this.store.filter('todo', function (todo) {
    // return !todo.get('isCompleted');
    // });
    // ** NEW CODE **
    return this.store.findQuery('todo', {isCompleted: false})
  },
  renderTemplate: function(controller){
    this.render('todos/index', {controller: controller});
  }
});

We can load the todo items correctly, but if we want to delete one of them a DELETE request is successfully sent to the backend but the todo-item is not removed from the UI.

EDIT: The delete action is:

removeTodo: function () {
  var todo = this.get('model');
  todo.deleteRecord();
  todo.save();
}

Upvotes: 1

Views: 277

Answers (1)

sly7_7
sly7_7

Reputation: 12011

The problem is with using findQuery here. It results in a non live array. That's why the view is not updated after delete (I think if you add a todo, it should neither work)

You can use store.filter passing it the query and the filter function. I think it should work as you expect.

Todos.TodosActiveRoute = Ember.Route.extend({
  model: function(){
    return this.store.filter('todo', {isCompleted: false}, function (todo) {
      return !todo.get('isCompleted');
    });
  },
  renderTemplate: function(controller){
    this.render('todos/index', {controller: controller});
  }
});

Upvotes: 1

Related Questions