Javascript HTML multi-level select menu

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
batfastad
Forum Contributor
Posts: 433
Joined: Tue Mar 30, 2004 4:24 am
Location: London, UK

Javascript HTML multi-level select menu

Post by batfastad »

Hi everyone

On a particular page in our intranet solution, I now have a need to implement a multi-level HTML select page. First time I've actually needed this in over 10 years.

I'm looking to make the sort of HTML select/option menu where what option the user chooses in select menu A, determines the options displayed in select menu B
I've tried googling to find some decent scripts but I reckon everyone calls them by different names, so I've not found much just yet.

I was wondering if anyone knows of any such scripts they could point me in the direction of?

Also, it would be mega-cool if I could just echo the options in JSON format into the top of the script.

Any ideas/suggestions?

Thanks, B
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: Javascript HTML multi-level select menu

Post by kaszu »

I call them chained selects.
Since i am to lazy today to write it for you, take a look here http://www.javascriptkit.com/jsref/select.shtml and

Code: Select all

var options = {'a': {'a1': 'A1', 'a2': 'A2'}, 'b': {'b1': 'B1', 'b2': 'B2'}, 'c': {'c1': 'C1', 'c2': 'C2'}};
var select1 = ...; //Get first select
var select2 = ...; //Get second select
var select2_value = ...;
 
//Remove all options, which already are there
... 
//Set new ones
for(var i in options[select2_value]) {
    ...
}
...
 
Post Reply