Select2 drop-down for countries, with flags

javascript, jquery-select2

Solution

I was working on a similar problem and here is how I solve it.

(function($) {
    $(function() {
        var isoCountries = [
            { id: 'AF', text: 'Afghanistan'},
            ...
        ];
        //Assuming you have a select element with name country
        // e.g. <select name="name"></select>

        $("[name='country']").select2({
            placeholder: "Select a country",
            data: isoCountries
        });
    });
})(jQuery);

I also have made a gist about it and following are the demos.

- Demo 1

- Demo 2 with flags based on official DOC of `select2`

Problem

Does somebody have an easy to use example of a country drop-down, with country flags, for `Select2`? I am about to implement one based on this suggestion, but I would prefer to avoid reinventing the wheel.

Original source

Related problems