JavaScript Search Form

[kwmlr439]

I was hoping someone could help me in a project that I’m working on. I’m searching for some ideas on how to populate a drop downs on a search form. I am using Word Press platform that runs on PHP MySQL as the back end database. For instance, the form will have U.S States followed by Counties then cities;

and if for example you select Pennsylvania it will automatically select Pennsylvania counties on the next cell. Ones you select a county then it will do the same thing to the cities and so fourth. Ones you click on the city and hit “Submit or search” It will find the page within your website that you selected for that purpose. An example would be find “Philadelphia” page IF you select Philadelphia and hit search.

I’m thinking JavaScript or JQuery?

I found this very helpful SQL Database full of States, Cities and Zip codes, Exactly what I'm looking for but I'm having a hard time understanding how to use it on WordPress. Please help!!!

Here is a sample of what I'm trying to do:

http://www.easywayserver.com/blog/ja...ng-select-box/

Here is a simple form that I built:


<form role="search" method="post" id="searchform" action="#" >
<input type="hidden" value="" name="s" />

<input type="hidden" value="listing" name="post_type" />
<select name='State' id='State' class='state'>
<option value="Select a State" selected>Select a State</option>
<option value="AL" >Alabama</option>
<option value="AK" >Alaska</option>
<option value="AZ" >Arizona</option>
<option value="AR" >Arkansas</option>
<option value="CA" >California</option>
<option value="CO" >Colorado</option>
<option value="CT" >Connecticut</option>
<option value="DE" >Delaware</option>
<option value="FL" >Florida</option>
<option value="GA" >Georgia</option>
<option value="HI" >Hawaii</option>
<option value="ID" >Idaho</option>
<option value="IL" >Illinois</option>
<option value="IN" >Indiana</option>
<option value="IA" >Iowa</option>
<option value="KS" >Kansas</option>
<option value="KY" >Kentucky</option>
<option value="LA" >Louisiana</option>
<option value="ME" >Maine</option>
<option value="MD" >Maryland</option>
<option value="MA" >Massachusetts</option>
<option value="MI" >Michigan</option>
<option value="MN" >Minnesota</option>
<option value="MS" >Mississippi</option>
<option value="MO" >Missouri</option>
<option value="MT" >Montana</option>
<option value="NE" >Nebraska</option>
<option value="NV" >Nevada</option>
<option value="NH" >New Hampshire</option>
<option value="NJ" >New Jersey</option>
<option value="NM" >New Mexico</option>
<option value="NY" >New York</option>
<option value="NC" >North Carolina</option>
<option value="ND" >North Dakota</option>
<option value="OH" >Ohio</option>
<option value="OK" >Oklahoma</option>
<option value="OR" >Oregon</option>
<option value="PA" >Pennsylvania</option>
<option value="RI" >Rhode Island</option>
<option value="SC" >South Carolina</option>
<option value="SD" >South Dakota</option>
<option value="TN" >Tennessee</option>
<option value="TX" >Texas</option>
<option value="UT" >Utah</option>
<option value="VT" >Vermont</option>
<option value="VA" >Virginia</option>
<option value="WA" >Washington</option>
<option value="WV" >West Virginia</option>
<option value="WI" >Wisconsin</option>
<option value="WY" >Wyoming</option>

<option value="Select a County">Select a County</option>
</select><select name='county' id='county' class='county'>
<option value="Select a County">Select a County</option>
</select><select name='city' id='city' class='city'>
<option value="Select a City">Select a City</option>
</select>
<select name='company' id='company' class='company'>
<option value="Select a Company">Select a Company</option>
</select><select name='agent type' id='agent type' class='agent type'>
<option value="Agents Type">Agents Type</option>
</select>
<input type="submit" id="searchsubmit" class="searchsubmit" value="Search Real Estate Agents" />
</form>