Dealing with non-saveable values in Backbone
backbone.js, database, javascript
Solution
I like Peter Lyon's idea. I've thought about that a few times, but never actually put it in place. For all the ways that I have handled this, though, here are my two favorites:
- Non-"attribute" values
- View Models
Non-Attribute Values
This one is simple: don't store the values you need in the model's standard attributes. Instead, attach it directly to the object:
myModel.someValue = "some value";
The big problem here is that you don't get all of the events associated with calling `set` on the model. So I tend to wrap this up in a method that does everything for me. For example, a common method I put on models is `select` to say that this model has been selected:
MyModel = Backbone.Model.extend({
select: function(){
if (!this.selected){
this.selected = true;
this.trigger("change:selected", this, this.selected);
}
}
});
In your case, I'm not sure this would be a good approach. You have data that needs to be calculated based on the values that are in your attributes already.
For that, I tend to use view models.
View models.
The basic idea is that you create a backbone model that is persist-able, as you normally would. But the you come along and create another model that inherits from your original one and adds all the data that you need.
There are a very large number of ways that you can do this. Here's what might be a very simple version:
MyModel = Backbone.Model.Extend({ ... });
MyViewModel = function(model){
var viewModel = Object.create(model);
viewModel.toJSON = function(){
var json = model.toJSON();
json.inches = json.mm / 25;
return json;
};
return viewModel;
});
The big benefit of wrapping this with `Object.create` is that you now have a prototypal inheritance situation, so all of your standard functionality from the model is still in place. We've just overridden the `toJSON` method on the view model, so that it returns the JSON object with the `inches` attribute.
Then in a view that needs this, you would wrap your model in the initialize function:
MyView = Backbone.View.extend({
initialize: function(){
this.model = MyViewModel(this.model);
},
render: function(){
var data = this.model.toJSON(); // returns with inches
}
});
`
You could call `new MyViewModel(this.model)` if you want, but that's not going to do anything different, in the end, because we're explicitly returning an object instance from the `MyViewModel` function.
When your view's render method calls `toJSON`, you'll get the `inches` attribute with it.
Of course, there are some potential memory concerns and performance concerns with this implementation, but those can be solved easily with some better code for the view model. This quick and dirty example should get you down the path, though.
Problem
Is there a standard way to deal with non-saveable values in Backbone. e.g. ``` MyModel = Backbone.extend(Backbone.Model, { initialize: function () { this.set({'inches': this.get('mm') / 25}); } }) ``` If I call save() on this model it will throw an error as there is no corresponding database field for `inches`. I can think of a few ways to fix this, but am wondering if there's a tried and tested approach generally best used for this? At the moment my preferred solution is to extend Backbone's `toJSON` method and to allow passing of a boolean parameter `dontCleanup` to allow for it to still return all the model's values (including the non saveable ones) when it's needed e.g. for passing to a template.