If I add an array of models to a collection, is backbone calling callback for each model inside of this array an add-event?
I was wandering, because my view, listening to add-events of this collection, get's rendered that often, although I'm just adding one array of models to the collection.
Yes look at the documentation.
Related
Backbone model attributes can be string, objects, backbone collection etc. But is it possible that an attribute is an array of backbone model?
Ex:
var Model - Backbone model
Model.get('charts') - Simple array [chart], here chart is the backbone model
Here my question is that ideally Backbone model attribute is if having array then it should be backbone collection or can be simple array of backbone Model?
Technically there is nothing preventing you from doing that. However, backbone features such as model events won't propagate up to your parent model, since backbone doesn't support nested model/collections out of the box. So you don't get any "special" benefits by making a model property backbone collection instead of a normal array.
I construct a CompositeView by passing it a collection. The collection gets its data via a url. I'm using the defer/promise technique to wait till the collection is populated before constructing the View.
Later I call fetch on the collection again, modifying the url.
To my surprise the CompositeView is re-rendered with the new data in the Collection. I thought I would have to do something e.g.:
collectionEvents: {
"sync" : "render"
}
But I'm not doing anything. No event binding at all. I thought in marionette I would have to handle this 'manually'.
This looks like something to do with CollectionView: Automatic Rendering. Does this happen with models and item views as well? And why do some tutorials etc. explain about binding?
Thanks
--Justin Wyllie
Yes but the only thing that will be re-rendered will be the collection, if you are using a CompositeView to display a model and a collection, the model part will not be re-rendered, you have to set an event for that.
So the CompositeView has the same behavior of the collectionView and it will re-render the collection whenever theres a change in the data.
And to your second question this does not happens in the ItemViews when the model changes.
this you have to do it on your own when its best for you application needs.
I have a Backbone view which represents a collection. When this collection is synced with the server, and new models are added to the collection, I would like to hide all the view instances that represent these new models in the collection, whilst continuing to display the old models' view instances. How can I do this?
I'm assuming you're using a Marionette.CollectionView or Marionette.CompositeView here, right? That being the case, you are trying to prevent these from showing the newly added models, when the come back from the server and are added to your collection, right?
I can see a few different ways of doing this, most of which begin at the same place: a collection that filters based on an attribute that tells you whether or not to show the model. You would need to have some piece of data on the models that tells you wether to show them or not... I'm not sure what this would look like off-hand, but once you have the logic set up for this, I think the rest of it becomes easier.
A Proxy Collection
My preferred method of handling this in the CompositeView or CollectionView would be to create the view instance with a proxy collection - one that is filtered based on the value to show or hide the models.
I've talked about proxy collections before, and I have a working JSFiddle to show how to build them, here: http://jsfiddle.net/derickbailey/7tvzF/
You would set up a filtered collection like this, and then send the filtered collection to your actual view instance:
var filtered = new FilteredCollection(myOriginalCollection);
filtered.filter({
showThisOne: true
});
var view = new MyCompositeView({
collection: filtered
});
myOriginalCollection.fetch();
From here, it comes down to how you want to manage the filtering and fetch/sync of the original collection. But I think the over-all solution hinges on the proxy/decorator collection and being able to filter the collection down to only the list of items that you want.
Views in Bbone are not automatically updated when the underlying model/collection is changed. You have to explicitly listen for events: change/destroy for models and add/change/remove/reset for collections and call render().
As WiredPrairie suggests, if you've registered during view initialization for example to listenTo() any of these events and explicitly render(), you can always use stopListening() to reverse the effect.
An alternative, in case it's a one-of case of suppressing the view from showing the changes, is to check manually in your view's render() which models have been changed and use the previous state of the changed attributes to avoid showing the new values. Check out: model.hasChanged() and model.previousAttributes() as well as the options.previousModels in case of a collection reset.
I am new to backbone.js and attempting to use patterns that I have used in other languages. Some of them work and some have fallen quite flat. My questions is this - how should I reference my model from within a view. For example, I have 5 identicals views that I passed a model from a collection of models. When the user clicks one of the 5 views, I need it to use the model that it was created with. Right now, I am getting null for this.model anytime the user clicks the view.
You need to pass the model in the view constructor as stated in the oficial doc http://backbonejs.org/#View-constructor
then you can access the model from the view with just this.model
if your getting undefined and you have passed the model in the view's constructor, maybe is because of the context when the callback function is being called,
have you checked that?
I have a list of songs (each one in the form of an album cover) that are sortable via jQuery UI's sortable library (http://jqueryui.com/demos/sortable/). All of the songs are models that reside in a single collection. When a "sorted" event is fired, I want to recalculate the order of the songs and update their respective indices. I know how to get the index of a model within a collection, but is it possible to update/set a model's index? I realize that I can just set an "order" attribute on the model and update that, but it seems like updating the indices would be much cleaner.
Sounds like you will want to define a comparator on the collection, then call sort on it when the widget's sorted event is fired.