/    Sign up×
Community /Pin to ProfileBookmark

Chaning Drop-Down Options

Copy linkTweet thisAlerts:
May 12.2005

[B][FONT=Arial][COLOR=DarkGreen]Does anybody know how to make it so that when an option is selected from one Drop-Down Menu, the Options in another Drop-Down Menu (DDM) are changed? I want to make it so when a user clicks an option on DDM #1, the list of options changes for DDM #2. Thanks for any help you can provide.

Trevor[/COLOR][/FONT][/B]

to post a comment
HTML

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@jmaresca2005May 13.2005 — try this:




<HEAD>

<SCRIPT LANGUAGE="JavaScript">


<!-- Begin

var arrItems1 = new Array();

var arrItemsGrp1 = new Array();

arrItems1[3] = "Truck";

arrItemsGrp1[3] = 1;

arrItems1[4] = "Train";

arrItemsGrp1[4] = 1;

arrItems1[5] = "Car";

arrItemsGrp1[5] = 1;

arrItems1[6] = "Boat";

arrItemsGrp1[6] = 2;

arrItems1[7] = "Submarine";

arrItemsGrp1[7] = 2;

arrItems1[0] = "Planes";

arrItemsGrp1[0] = 3;

arrItems1[1] = "Ultralight";

arrItemsGrp1[1] = 3;

arrItems1[2] = "Glider";

arrItemsGrp1[2] = 3;

var arrItems2 = new Array();

var arrItemsGrp2 = new Array();

arrItems2[21] = "747";

arrItemsGrp2[21] = 0

arrItems2[22] = "Cessna";

arrItemsGrp2[22] = 0

arrItems2[31] = "Kolb Flyer";

arrItemsGrp2[31] = 1

arrItems2[34] = "Kitfox";

arrItemsGrp2[34] = 1

arrItems2[35] = "Schwietzer Glider";

arrItemsGrp2[35] = 2

arrItems2[99] = "Chevy Malibu";

arrItemsGrp2[99] = 5

arrItems2[100] = "Lincoln LS";

arrItemsGrp2[100] = 5

arrItems2[57] = "BMW Z3";

arrItemsGrp2[57] = 5

arrItems2[101] = "F-150";

arrItemsGrp2[101] = 3

arrItems2[102] = "Tahoe";

arrItemsGrp2[102] = 3

arrItems2[103] = "Freight Train";

arrItemsGrp2[103] = 4

arrItems2[104] = "Passenger Train";

arrItemsGrp2[104] = 4

arrItems2[105] = "Oil Tanker";

arrItemsGrp2[105] = 6

arrItems2[106] = "Fishing Boat";

arrItemsGrp2[106] = 6

arrItems2[200] = "Los Angelas Class";

arrItemsGrp2[200] = 7

arrItems2[201] = "Kilo Class";

arrItemsGrp2[201] = 7

arrItems2[203] = "Seawolf Class";

arrItemsGrp2[203] = 7

function selectChange(control, controlToPopulate, ItemArray, GroupArray)

{

var myEle ;

var x ;

// Empty the second drop down box of any choices

for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;

if (control.name == "firstChoice") {

// Empty the third drop down box of any choices

for (var q=myChoices.thirdChoice.options.length;q>=0;q--) myChoices.thirdChoice.options[q] = null;

}

// ADD Default Choice - in case there are no values

myEle = document.createElement("option") ;

myEle.value = 0 ;

myEle.text = "[SELECT]" ;

controlToPopulate.add(myEle) ;

// Now loop through the array of individual items

// Any containing the same child id are added to

// the second dropdown box

for ( x = 0 ; x < ItemArray.length ; x++ )

{

if ( GroupArray[x] == control.value )

{

myEle = document.createElement("option") ;

myEle.value = x ;

myEle.text = ItemArray[x] ;

controlToPopulate.add(myEle) ;

}

}

}

// End -->

</script>

</HEAD>


<BODY>

<form name=myChoices>

<table align="center">

<tr>

<td>

<SELECT id=firstChoice name=firstChoice onchange="selectChange(this, myChoices.secondChoice, arrItems1, arrItemsGrp1);">

<option value=0 SELECTED>[SELECT]</option>

<option value=1>Land</option>

<option value=2>Sea</option>

<option value=3>Air</option>

</SELECT>

</TD><TD>

<SELECT id=secondChoice name=secondChoice onchange="selectChange(this, myChoices.thirdChoice, arrItems2, arrItemsGrp2);">

</SELECT>

<SELECT id=thirdChoice name=thirdChoice>

</SELECT>

</TD>

</TR>

</TABLE>

</form>
Copy linkTweet thisAlerts:
@gatewizardMay 13.2005 — Drop down & populate worked great but now after the options in the drop down menu 2 fill how do you get them to execute a link from there?

thx
×

Success!

Help @tmcarlee spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.14,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...