PDA

View Full Version : HTML-forms: dynamic option list via javascript/ajax?



mostwanted
07-24-2008, 01:11 PM
there is am form on a site i am working on where visitors can search for holiday houses:



<form id="search" method="get">
<p>
<select size="1" name="k">
<option value="">category</option>
<option value="3">3*</option>
<option selected="selected" value="4">4*</option>
<option value="5">5*</option>
</select>
</p>
<p>
<select size="1" name="w">
<option value="">size</option>
<option value="50">< 50 mē</option>
<option value="70">50 - 70 mē</option>
<option value="95">75 - 95 mē</option>
<option value="1000">more than 95 mē</option>
</select>
</p>
<p id="number_of_persons">
<select size="1" name="p">
<option value="">number of persons</option>
<option value="2">2 persons</option>
<option value="3">3 persons</option>
<option value="4">4 persons</option>
<option value="5">5 persons</option>
</select>
</p>
<p id="search">
<input class="button" type="submit" value="search"/>
</p>
</form>


i would like to make the form more dynamic for the visitors - if one selects one option in one of the select-boxes the other options of the other select boxes should change dynamically. so that one can only choose from possible options in the other select boxes.

is there any javascript-/ajax-framework for such a task?

thanks for your help!


PS: data is coming from a mySQL-database.

Nile
07-24-2008, 01:17 PM
Does this help you at all: http://www.dynamicdrive.com/dynamicindex16/chainedselects/index.htm
I hope it does,
Nile

mostwanted
07-24-2008, 01:30 PM
thanks for your reply.

no, unfortunatelly not.

every order of the selection should be possible:

select box 1 - select box 2 - select box 3
select box 2 - select box 3 - select box 1
select box 3
select box 3 - select box 2
select box 3 - select box 2 - select box 1
etc.

Nile
07-24-2008, 01:53 PM
You can still easily hook it up with the chained selection script. Unless I do not understand what you want completely... Can you make an image, or give an example?

mostwanted
07-24-2008, 03:22 PM
here is an example:

a visitor is searching for a holiday flat and uses the search form on the website to see the holiday flats which meet his expectations:

--- example ---
first he wants a 5* holiday flat (he selects the 5*-option in the "categories-select-box" of the search form)

he also wants a holiday flat which is larger than 100m2 (so he selects the ">100m2-option" in the "size-select-box" of the search form)

etc.
--- /example ---

how should the form react after selecting the 5*-option? it should only list the options which are avaiable in the other 2 select boxes, etc.

i hope you can understand my explanation - sorry for my poor english.

thank you for your help.

http://www.naturgastgeber.de/temp/search-form.gif