Monday, 1 March 2021

Select2 search with world_countries

I connected https://github.com/stefangabos/world_countries cdn list with select2 to list all countries. Does anybody know how to search within countries?

var countriesList = 'https://cdn.jsdelivr.net/npm/world_countries_lists@latest/data/en/countries.json';

$('select').select2({
  ajax: {
    url: countriesList,
    dataType: 'json',
    delay: 250,
    data: function (params) {
      console.log(params.term);
      return {
        q: params.term
      };
    },
    processResults: function (data) {
      return {
        results: $.map(data, function (item) {
          return {
            id: item.id,
            text: item.name
          };
        })
      };
    }
  },
  width: 300,
  dropdownAutoWidth: true
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/js/select2.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/select2.min.css" rel="stylesheet"/>

<select></select>


from Select2 search with world_countries

No comments:

Post a Comment