0

I am new to backboneJS. I downloaded the code from www.todomvc.com. I have a button which triggers the moveUp function below which will move the 'todo' model one step above i.e. prioritize, It arranges the collection on attribute 'order'. What I wanted was that I can Swap the 'order' attribute of both the models. This is what I thought would work.... 

moveUp: function(){
    var index = this.model.collection.indexOf(this.model);
    var nextModel = this.model.collection.at(index+1);

    var order1 = this.model.attributes.order;
    var order2 = nextModel.attributes.order;

    this.model.set('order', order2);
    this.model.collection.models[index + 1].set('order', order1);

}

But this doesn't work, the 'order' attribute remains same before and after code. The things that I have tried are:

model.set({'order',order1});


model.set('order',order1);


var order = _.clone(model.get('order'));
model.set(order, order1);


var map = {};
map['order'] = value;
this.model.set(map);

The code is shared here. If some one can point out where I am wrong. Also I read somewhere that it will not trigger 'change'. Help will be highly appreciated.

MUHAMMAD ALI MAHMOOD
  • 1
  • 3

1 Answers1

1

I see a problem in the way you are setting the new order values.

Backbone Model set requires either a hash of properties or 2 arguments for the property name and value. From the documentation:

Set a hash of attributes (one or many) on the model. If any of the attributes change the model's state, a "change" event will be triggered on the model. Change events for specific attributes are also triggered, and you can bind to those as well, for example: change:title, and change:content. You may also pass individual keys and values.

So you can call set using any of these 2 ways:

this.model.set({'order': order2}); //note the curly brackets, so you pass a hash of attributes
this.model.set('order', order2); //note prop name and value are 2 separated arguments
Daniel J.G.
  • 34,266
  • 9
  • 112
  • 112
  • It should work, have a look at [this fiddle](http://jsfiddle.net/f18c7Ltn/1/). Are you sure `model` and `nextModel` are what you expect? Have you checked the order attribute on both models at the end of the moveUp method? – Daniel J.G. May 17 '15 at 11:27
  • The order remained also the same after your fiddle – MUHAMMAD ALI MAHMOOD May 18 '15 at 06:19
  • Have you opened the javascript console after loading the fiddle? You should open the console and then run the fiddle. Otherwise when you log an object, if the console is opened after the log statements were executed it will show you the latest state of the object (at least in chrome). For example, try [this fiddle](http://jsfiddle.net/u0q6y9b4/) with the console closed, then open the console and have a look at the logged values. After that, with the console opened run again the fiddle and check the logged values. – Daniel J.G. May 18 '15 at 09:46
  • You wont be affected by this behaviour of the chrome console if you log strings instead of objects as in `console.log(todos.models[0].attributes.title + " " + todos.models[0].attributes.order);`. Of course you could also use the debugger to inspect the objects instead of relying in log statemtens :) – Daniel J.G. May 18 '15 at 09:56
  • This question explains the behaviour of logging objects in chrome http://stackoverflow.com/questions/8249136/why-does-javascript-object-show-different-values-in-console-in-chrome-firefox – Daniel J.G. May 18 '15 at 09:57