14 Jan, 2018

Display Country State City using Google API

14 Jan, 2018

Dear Reader, Let us learn about to Display Country State City using Google API. As when you are talking about registration of any user to your application. Then you must need to Display Country State City select box for address locations, which user will need to fill during his/her registration process. And if a user wants to fill his address then an address panel should be there. So that user can fill his address location like Country State City from the input box provided by you, without any tease. Therefore Google API will be the best option for us. So we are going to “Display Country State City using Google API“.

For this, we need to generate Google API Key from Get a key for Google Places API Web Service.  As for example :- AIzaSyC-zm16nNi4K_92bmvJppoV_0WwNVFH4WA . But for your ease, we are giving you pre-generated Google API Key. This is placed in the code. So right now, you don’t need to go to Developers Google WebSite for generation of API Key. You just need to copy and paste the code given below for checking to Display Country State City using Google API.

Let us start it step by step:-

Step 1.

You need to create an HTML page having an input box for taking location input.

Step 2.

Now you need to call Google API script.

Display Country, State, City

Now you can see your result. As the user will type any letter then Google API will display suggestions of locations with Country, State, and City. So it will be easier for a user as well as a developer to display the Country, State, and City selection. It was an old pattern that you need to select Country from a drop-down select box and then on selection of Country, State select box will be filled with data from all States of that selected Country. And on a selection of any particular State, City select box will be populated with All City data of that particular State selected.

Step 3.

Hence this is final or single Step to Follow. Here is full code file named get_location.php.

On selection of location, next three input boxes will be auto-filled with City, State, and Country respectively.

Recently Updated Code :-

In recent days I got some mistakes has been done with above code. So below are Updated One with Error Free Code and It will display Proper City, State,  Country and PIN Code in their respective fields.

Hence Locations provided by you in the “Enter the Location” input box will be fetched by Google API on every KeyUp Event of the keyboard.

Display Country State City using Google API

Congratulations you have successfully Completed to Display Country State City using Google API, if you like this post and was helpful for you then share this post on social media and if you have any query then please contact us or comment below and don’t Forget Like and Follow us on Social MediaThanks.



  • Farah September 06, 2018

    very nice article.
    Very informative.
    Keep it up


    • Webpreparations Team September 07, 2018

      Dear Reader
      Thank you so much for your appreciation, we are always ready to share our knowledge 🙂


  • shani May 18, 2019

    that’s good


    • Webpreparations Team May 22, 2019

      Thank you so much dear for your appreciation 🙂


Leave a comment:

Your email address will not be published. Required fields are marked *