Thursday, November 10, 2011

Handy code for City, State, Zip, Country selector via JS


Today I got a new project to work on the client needs a registration form having Country, City, State and Zip Code including the Geo Location and Latitude. There was a location based searching for the system, so what we needed was to do a full validated geo fields without any kind of errors. I tried to do it via Ajax and so that  it will be the best for validation as well as interactive to the user also.
While searching  I got something which is very handy from geonames. I tried to do API calls to their web services so that I can get whatever details I want from them.

Sample API Call


The result obtained was a JSON string, 

jQ({"totalResultsCount":1,"geonames":[{"alternateNames":[{"name":"তিরুবনন্তপুরম","lang":"bn"},{"name":"ত্রিবানদ্রাম","lang":"bpy"},{"name":"Thiruvananthapuram","lang":"de"},{"name":"Thiruvananthapuram","lang":"en"},{"name":"Thiruvananthapuram","lang":"eo"},{"name":"Thiruvananthapuram","lang":"fi"},{"name":"Thiruvananthapuram","lang":"fr"},{"name":"तिरुअनन्तपुरम्","lang":"hi"},{"name":"Thiruvananthapuram","lang":"id"},{"name":"ティルヴァナンタプラム","lang":"ja"},{"name":"http://en.wikipedia.org/wiki/Thiruvananthapuram","lang":"link"},{"name":"തിരുവനന്തപുരം","lang":"ml"},{"name":"Trivandrum","lang":"nl"},{"name":"Trivandrum","lang":"pl"},{"name":"Thiruvananthapuram","lang":"pt"},{"name":"Thiruvananthapuram","lang":"ro"},{"name":"Тируванантапурам","lang":"ru"},{"name":"तिरुवनंतपुरम","lang":"sa"},{"name":"Thiruvananthapuram","lang":"sv"},{"name":"திருவனந்தபுரம்","lang":"ta"},{"name":"特里凡得琅","lang":"zh"}],"countryName":"India","adminCode1":"13","fclName":"city, village,...","score":28.883577346801758,"countryCode":"IN","lng":76.9166667,"adminName2":"","adminName3":"","fcodeName":"seat of a first-order administrative division","adminName4":"","timezone":{"dstOffset":5.5,"gmtOffset":5.5,"timeZoneId":"Asia/Kolkata"},"toponymName":"Thiruvananthapuram","fcl":"P","continentCode":"AS","name":"Thiruvananthapuram","fcode":"PPLA","geonameId":1254163,"lat":8.4833333,"adminName1":"Kerala","population":784153}]});

This API call can be used as an auto-suggestion for a text field which will be very handy for the developer instead of typing all the city, state, country data to the database.

You can also use the web services of geonames for geo location extraction,
http://www.geonames.org/export/web-services.html



GeoNames is mainly using REST webservices.

And finally the AIO,

Important:

I’m sure that this will be the best for the one who seeks this.

Post a Comment

Popular Posts