geocomplete is a popular jQuery plugin wrapping Google Maps API's Geocoding and Places Autocomplete services. It allows us to choose an address from autocomplete dropdown list while searching for a location.
The following example demonstrates how to use FormValidation with the geocomplete plugin. It requires user to fill in an address which can be chosen from the autocomplete list. If user enter a straight text that isn't found after looking by the Google Map API's, the address will be treated as invalid one.
You should look at the basic principles when integrating FormValidation with other plugins
A particular address is defined by a latitude and longitude coordinates:
Both value must be the number
The latitude must be between -90 and 90
The longitude must be between -180 and 180
geocomplete provides the ability of populating these coordinates after selecting the address from the list. Then we can use these values to validate the address via the callback validator:
When user enter a a straight text, we need to reset the latitude, longitude values and mark the field as not validated yet via the updateStatus() method:
Below is live demonstration which you can play with: