jquery - Count duplicates within observableArray and Display them -
i have observable array following data
["volkswagen", "toyota", "volkswagen", "toyota", "audi", "volkswagen", "toyota", "audi"]
i know how can count duplicate values , display them within select box. like:
volkswagen (3) audi (2) toyota (3)
what best way achieve this?
i'd use straightforward computed:
viewmodel.collapsedmakes = ko.computed({ pure: true, owner: viewmodel, read: function() { var makes = {}, rv; // use object count them this.makes().foreach(function(make) { if (makes[make]) { ++makes[make]; } else { makes[make] = 1; } }); // build array rv = object.keys(makes).sort().map(function(make) { return make + " (" + makes[make] + ")"; }); return rv; } });
live example:
var viewmodel = { makes: ko.observablearray([ "volkswagen", "toyota", "volkswagen", "toyota", "audi", "volkswagen", "toyota", "audi" ]) }; viewmodel.collapsedmakes = ko.computed({ pure: true, owner: viewmodel, read: function() { var makes = {}, rv; // use object count them this.makes().foreach(function(make) { if (makes[make]) { ++makes[make]; } else { makes[make] = 1; } }); // build array rv = object.keys(makes).sort().map(function(make) { return make + " (" + makes[make] + ")"; }); return rv; } }); ko.applybindings(viewmodel, document.body);
<select data-bind="options: collapsedmakes"></select> <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
Comments
Post a Comment