Auto-select country from dropdown with GEOIP

Posted on

There are 195 countries in the world and asking your user to select the one they are in from a dropdown can be a pain - especially if they’re on a mobile device. Save them the bother by using a GeoIP service and preselecting their current country based on their IP address. In the unlikely event that the user wants to select a different country they can change it.

ProTip: You should also add autocomplete="country-name" to the select to take advantage of address autocomplete if the country is different.

This is a simple auto-select country from a dropdown using the free GEOIP DB service and jQuery

DEMO: https://coliff.github.io/geoip-db-country-select/

Made with: #

jQuery: https://jquery.com/

Geoip-db service: https://geoip-db.com/

Countries list from: https://github.com/mledoze/countries

You might also like

Styling External Links with an Icon in CSS

Using a CSS pseudo selector targeting only external links

Self hosting Google Fonts for improved performance

A Hassle-Free Way to Self-Host Google Fonts