I have a drop down select box which displays a list of countries for the user to choose from. It’s common practice these days to have the most frequently selected countries listed at the top of the list so they can be selected quicker. Let’s see how we can achieve this using AngularJS. I’m using Bootstrap for the drop down box.
Original List, alphabetically ordered.
New List, alphabetically ordered with most common countries at the start. This is the demo i made in plunker.
AngularJS Bootstrap Drop Down Demo
Note: A little bit of manual work with adding the countries and ids to the array but that’s about it.