0

I have a User model(Backbone.js) and I want to update its settings attribute and then save it to the server. Settings is in JSON format, and the way I have it set up is that settings is the string version and settingsJSON is the object version. I bind functions to the change event of each so that when one changes, it updates the other.

The problem I am having, is that the save method is running before the changed handler is finished running. Is there any way i could ensure that all event handlers for that model are complete or something like that?

how I'm calling it:

currentUser.get('settingsJSON').apps = appsEnabled;
currentUser.save();

My event handlers:

Initialize: function() {
    var that = this;
    this.on("change:settingsJSON", function(model){
        model.set({settings: JSON.stringify(model.get('settingsJSON'))});
    });

    this.on("change:settings", function(model){
        model.set({settingsJSON: JSON.parse(model.get('settings'))});
    });
}

@fencliff:

The change event is firing when I run this and works properly, I had it print the new settings string to the console.

Are you sure that they are called synchronously? I added console.log('changed') to the end of the .on(change) and put console.log('saved') directly after currentUser.save() and every time the console read:

saved
changed

For now I have just made it so that I stringily the JSON and save it to settings directly before I save and that works fine.

2
  • I'm relatively sure that the events are fired synchronously, and also that model.get('settingsJSON').apps = true will not trigger any events. But I've been wrong twice in this thread already, so what do I know. Here's a demo: jsfiddle.net/T7jKg . Can you fork it and show what's going on in your code?
    – jevakallio
    Jan 6, 2013 at 20:37
  • @fencliff I think what must have been happening was that change was being fired by something else, possible the .save(). Not totally sure. I will probably revisit this later to try to get it working how i want it, but for now my fix will work Jan 6, 2013 at 21:51

1 Answer 1

2

Backbone events are executed synchronously. That means that unless you (or some library) has overridden some part of the event handling, the change handlers will have processed as soon as you execute the next line of code.

In you code example there is another problem. When you call

user.get('settingsJSON').apps = appsEnabled;

The change event will not fire, because the value of settingsJSON has not been changed, merely the contents of the object were modified. The model.attributes.settingsJSON is still the same object as before.

The events are fired only when you call set on the property, and the new value is a different object. For example:

user.set('settingsJSON', _.extend({}, user.get('settingsJSON'), {apps:appsEnabled});

Another problem, it would seem, is that your event handlers, if triggered, would cause the change event being fired twice for the property which was first set:

this.on("change:settingsJSON", function(model){
    //-> changes settings, and set triggers change
    model.set({settings: JSON.stringify(model.get('settingsJSON'))});
});

this.on("change:settings", function(model){
    //-> changes settingsJSON, and set triggers change
    model.set({settingsJSON: JSON.parse(model.get('settings'))});
});

To solve that issue, call set with {silent:true} or modify the model.attributes hash directly.

Edited with corrections by @muistooshort.

Edited again with further corrections

7
  • Are you sure those two set calls will trigger "change" events? Jan 6, 2013 at 17:23
  • @muistooshort, I don't see why they wouldn't, but then again I'm pretty drunk and on my phone so can't test. Why wouldn't they?
    – jevakallio
    Jan 6, 2013 at 19:10
  • They won't because set essentially uses == to skip setting attributes that haven't changed adding a new property to an object won't change its reference value. You'd need to hand set something more like _.extend({}, user.get('settingsJSON'), { apps: appsEnabled }) to force the production of a new object so that you can get past the simple-minded equality filter. Jan 6, 2013 at 19:14
  • More details on this particular set trap: stackoverflow.com/a/13369672/479863 and stackoverflow.com/a/11662381/479863 Jan 6, 2013 at 19:18
  • @fencliff see my edits. I did change them to {silent: true} though, good heads up. mu is too short i will look at those Jan 6, 2013 at 19:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.