Filterable Country & Continent Picker For jQuery - niceCountryInput

File Size: 101 KB
Views Total: 20166
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Filterable Country & Continent Picker For jQuery - niceCountryInput

niceCountryInput is a convenient country picker plugin that enables the user to select countries, continents, regions from a filterable dropdown list, with support for country flags and ISO codes.

See also:

How to use it:

1. Import the latest jQuery library and the niceCountryInput's files into the html file.

<link rel="stylesheet" href="niceCountryInput.css">
<script src="" 
<script src="niceCountryInput.js"></script>

2. Create an empty DIV container and config the country picker with the following data attributes:

  • data-selectedcountry: pre-selected contry
  • data-showspecial: shows special countries
  • data-showflags: shows country flags (base64 image). Set to false to show ISO-3166-1 Alpha-2 codes.
  • data-i18nall: text for All selected
  • data-i18nnofilter: text for No selection
  • data-i18nfilter: text for Filter
  • data-onchangecallback: callback function
  • data-showcontinentsonly: shows continents only
<div class="example" 
     data-i18nall="All selected"
     data-i18nnofilter="No selection" 

3. Initialize the country picker and done.


  new NiceCountryInput($("#example")).init();


4. Define your own function that will be triggered on country change.

function onChangeCallback(ctr){
  console.log("The country was changed: " + ctr);



  • Re-init appends additional menus

This awesome jQuery plugin is developed by masbaehr. For more Advanced Usages, please check the demo page or visit the official website.