Prevent itemView from being added to CompositeView after collection "add"

Question

I have a problem with Backbone and Marionette. I have a CompositeView with a collection where people can a comment, this all works nicely, the comment is added and saved to the server but I don't want the view to update and to show the newly added comment. I have tried this:

App.Views.CommentsView = Backbone.Marionette.CompositeView.extend({
    template: '#article-comment-container',
    itemViewContainer: 'ul',
    itemView: App.Views.CommentView,
    collectionEvents: {
        "add": "modelAdded"
    },
    modelAdded: function(){
        console.log('Please do nothing!');
    }
});

But the item is still rendered into the page on top of my modelAdded function being called. Can I prevent that from happening at some point?

In a different scenario I would like new items to be added to the top of the list and not the bottom. Do I have to override the entire appendHtml method achieve this?

Answer 1

Setting the collection event add simply adds another handler to the queue for that event; it doesn't replace any other events so the default marionette behaviour will still occur.

I assume you're calling the create method on the collection to create your new comment model. If this is the case you simply need to set the silent option to true. Now the add event will not fire and Marionette will not create and render the view for that model. You can do it like this:

commentCollection.create(commentModel, {silent: true});

As for you second question about prepending, yes I would override appendHtml method. Or to keep the method names consistent with what actually happens, create a method called prependHtml and then override the renderItemView method to call prependHtml.