View Full Version : Use ajax to import input selector depending on parent selector

11-19-2010, 08:23 PM
I have a registration form that I built that uses a script to show dependent input selectors dependent on the selection in a parent selector for the location fields. Basically it goes like this:
Parent selector: Country
If United States selected the input selector for US states appears below it.
If Canada selected the input selector for Canadian provinces appears below it.
If United States selected as country and Alabama selected as state the input selector for Alabama cities appears.

This goes on for every state in the US. Otherwise a blank text field input will appear. This results in a TON of values being loaded on page load causing slow page load and actually breaking a Joomla component I use that handles the profile edit for Community Builder. But we decided this was important to keep the location fields uniform in order to keep good search results when searching for members by location due to the many variances in how country, state, and cities can be entered using blank text fields with abbreviations, misspellings, etc.

There has to be a simple way to keep these values in a separate file and use AJAX to simply pull the dependent selector on fire on the parent input, but I'm not fluent enough in AJAX to build this from scratch and I can't seem to find a decent script already out there to do this. This could also be done via database as well I suppose instead of an external file, either way I just need to get the 50 city selectors from all loading up on page load and only load when the parent value is fired.

Does anyone know of a script that I can use for this somewhere?

11-19-2010, 08:58 PM
A quick Google reveals ...