Implementing hierarchical drop-downs without page reloads

[Stretchwickster]

Hi there,

I'm currently working on a web form which has dynamically populated drop-down boxes. I would like to implement the following behaviour amongst the drop-downs: when an option is selected in drop-down A it affects the contents of drop-down B.

Ideally, what I would like to do is run a database query on the server, without reloading the page, when the option in drop-down A is selected (because drop-down B may have several thousand options if no filter were applied to it).

One way I can think of would be to build a javascript array of all the options when the page is first loaded, catch the onchange event when an option is selected in drop-down A, and add the appropriate options to drop-down B.

I'm not sure if this is the best way to go in terms of speed as there will be a lot of items to be processed in the various arrays.

Is there a solution which is better suited to this scenario? I would greatly appreciate your views as to the best way to tackle this.


Clive

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096

 

[jpadie]

the easiest solution is javascript, either on its own or with some server interaction using AJAX. the choice will be one of speed in your distinct scenario.

given previous posts on html_quickform, have you considered using their hierarchical selects (for a straightforward js implementation)?

 

[Stretchwickster]

jpadie,

I did have a quick look at using hierarchical selects but they didn't seem flexible enough for me to use. I had several problems when playing about with them in a trial page:
1) I couldn't find a way to pass a label to the second select
2) I couldn't find a way of linking two drop-downs that weren't next to each other.
3) I couldn't find a way of linking drop-down A with drop-downs B & C.

Maybe, it's my lack of experience with HTML_Quickform. If so, I'd happily be informed so that I can use hierarchical selects.

Otherwise, I guess I'll try the AJAX option as I think the straight JS will be too slow for my needs.

Clive

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096