Filter and sort the base collection with an array of identifiers

Question

I am new to Backbone, so I am having problems that I cannot understand.

I have a Backbone collection with just over 100 elements. I want to filter them using an identifier array, which works fine, but I want the element order to also be based on that array element order. This does not work. Other sorting methods seem to be based on aspiration, this is not what I need. Is it possible to get elements using this filter and then also put them in the collection in the order that I defined?

I have an id array that I'm filtering with, this array looks like this:

var dDefaultItems = ['1','2','146','3','4','9','26','8','96','10','11','54','145','273','38']; 

The code for collecting and filtering is as follows:

 var ChannelCollection = Backbone.Collection.extend({ fetch : function() { var params = _.extend({}, arguments, { data : { "groupnumber" : "1000" } }); this.constructor.__super__.fetch.apply(this, [params]); }, model : Channel, url : function () { return utility.apiUrl('/myurl/tothething'); }, filterData: function(params) { this.originalModels = this.models.slice(); _.each(params, function(val, key){ if (typeof val !== 'object') val = [ val ]; this.models = _.filter(this.models, function(model){ return _.indexOf(val, model.get(key)) !== -1; }, this); }, this); return this.reset(this.models).toJSON(); }, parse : function(json) { return json.channelInfoList; } }); 

Then I visualize this in the view using this code (there are other bits of code to define the model and other attributes that I think are not relevant, I can be wrong, but I think someone will know what I need from the look on this.)

 var ChannelListView = Backbone.View.extend({ initialize: function() { var _this = this; currentChannelList = new ChannelCollection(); currentChannelList.once("sync", function() { _this.render(); }); currentChannelList.fetch(); }, render : function() { var _this = this; $(_this.el).empty(); dust.render("list-channels", { channelList : currentChannelList.filterData({id: dDefaultItems})} , function(err, html) { var $el = $(html).appendTo($(_this.el)); }); } }); 

Answer 1

Suit collections are automatically sorted by insertion order if you do not implement Collection#comparator . The problem is that your filtering algorithm does not produce ordered output.

If you need to maintain an ordered collection only when filtering by id, I would suggest implementing a separate method, because seach by id is much faster compared to searching by arbitrary attributes:

 filterById: function(idArray) { return this.reset(_.map(idArray, function(id) { return this.get(id); }, this)); } 

Using:

 collection.filterById(['1', '2', '146', '3', '4', '9', '26', '8', '96', '10', '11', '54',' 145', '273', '38']);