My javascript knowledge is rather basic. I've just plowed though a few javascript references in the last week and just started creating my first scripts this weekend.
To provide more info here is a bit more of an example to what i posted earlier
(ps. I've used countries and cites as a substitute for what my actual dropdowns are for my app)
DROPDOWN 1:
- <select name="countries" id="countries">
-
<option value="1">Australia</option>
-
<option value="2">England</option>
-
<option value="3">Germany</option>
-
<option value="4">USA</option>
-
</select>
For dropdowns 1 and 2 the 'value' attribute relates to the primary key in the database for that country
For dropdown 2 the 'name' attribute relates to the corresponding countryID from dropdown 1
DROPDOWN 2:
- <select name="cities" id="cities">
-
<option name="1" value="1">Brisbane</option>
-
<option name="1" value="2">Melbourne</option>
-
<option name="1" value="3">Sydney</option>
-
<option name="2" value="4">Liverpool</option>
-
<option name="2" value="5">London</option>
-
<option name="2" value="6">Manchester</option>
-
<option name="3" value="7">Berlin</option>
-
<option name="3" value="8">Hamburg</option>
-
<option name="3" value="9">Munich</option>
-
<option name="4" value="10">Chicago</option>
-
<option name="4" value="11">Los Angeles</option>
-
<option name="4" value="12">New York</option>
-
</select>
-
i think you've sparked an idea for me to be able to solve the problem ive got or maybe its actually what your saying.
I'm thinking that when the page loads a class is applied to dropdown 2 giving it a display of none hiding it from the user. When an option from dropdown 1 is selected a function would create a new 'third' <select></select> dropdown and fill it with <options></options>s. I presume we'd use cloneNode() to copy the required options from dropdown 2 and insert them in to the newly crated dorpdown 3.
When the user selects a new option in dropdown 1 the function would run again and rewrite the options in dropdown 3.
if you think this is a workable solution I'll focus my efforts on this model. my only concern is that a I have at least 600 <options></options> in dropdown 2. do you think that there might be any performance issues. one country has say 400 cites, the rest say 100, 50, 20, 20, 10.
ps. is it out of the question to add and then remove the <!-- --> html comments using javascript to the the <option></option> tags in dropdown 2 as i mentioned earlier on.
thanks for your help on this.