Backbone re-order a collection so that home is always first?

Question

I made a FIDDLE

In my main app for when changing the home team to a new team, if the model in the collection is at the bottom it will be rendered at the bottom regardless if it's home or away.

I want to use a comparator to set the model with the home attribute ahead of the model with the away attribute so that the order upon rendering will always be home -> away.

This is nice so that I dont have to do any DOM manipulation, just let the order of the models handle my UI.

Example collection

var teams = new TeamsCollection([
    { team_name: 'bulls', playing: true, side: 'home' },
    { team_name: 'wizards', playing: true, side: 'away' },
    { team_name: 'spurs', playing: false, side: null }
]);

Then I have some logic to limit what models I pass to my view, the view would only render team_name: 'bulls' and team_name: 'wizards'

Bulls is already home so it's already first in order, and then the away wizards is below. I want to keep the home team as the first team.

So I have logic that re-renders the collection when you want to change the home team to the spurs for example, it would set the team_name: 'bulls' to playing: false, side: null and the spurs to playing: true, side: 'home'

Since the spurs model is the last model in the collection it will be rendered under the away wizards. I know this can be changed by using a comparator, but I am slightly confused since I am not adding, I am setting.

Answer 1

Call teams.sort() to re-order based on the comparator after you've changed any of the model's attributes.