alex4544
asked on
Dynamic Hyperlink Drop Down boxes
Hi,
Im looking to create a php/html page with two drop down boxes and a selection button
What I want is the selection options in the second drop down box to change depending on what the first drop down box is selected on, the first drop down only having 2 options A/B
Once the selection is choosen I want each of the choices in the second box to have a hyperlink value so that when the Selection Button "Next" is choosen it will have a dynamic URL based on the two drop down boxes
I have seen some code for the drop down boxes that gives an alert dependant on the choices but I want the choices to have a hyperlink instead.
Here is the code I found for dynamic drop downs
http://www.felgall.com/jstip22.htm
Im looking to create a php/html page with two drop down boxes and a selection button
What I want is the selection options in the second drop down box to change depending on what the first drop down box is selected on, the first drop down only having 2 options A/B
Once the selection is choosen I want each of the choices in the second box to have a hyperlink value so that when the Selection Button "Next" is choosen it will have a dynamic URL based on the two drop down boxes
I have seen some code for the drop down boxes that gives an alert dependant on the choices but I want the choices to have a hyperlink instead.
Here is the code I found for dynamic drop downs
http://www.felgall.com/jstip22.htm
Just specify the url of each option as the value like "<option value="https://www.experts-exchange.com">Experts Exchange</option>
ASKER
Will doing that work with the JS I linked to?
Just modify the js like the following:
function setOptions(chosen) {
var selbox = document.myform.opttwo;
selbox.options.length = 0;
if (chosen == " ") {
selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' ');
}
if (chosen == "1") {
selbox.options[selbox.options.length] = new Option('Experts Exchange','http://www.experts-exchange.com');
selbox.options[selbox.options.length] = new Option('Google','http://www.google.com');
}
}
ASKER
For example the folling HTML
<form name="myform"><div align="center">
<select name="optone" size="1"
onchange="setOptions(docum ent.myform .optone.op tions[docu ment.myfor m.optone.s electedInd ex].value) ;">
<option value=" " selected="selected"> </option>
<option value="1">A</option>
<option value="2">B</option>
</select><br /> <br />
<select name="opttwo" size="1">
<option value=" " selected="selected">Please select one of the options above first</option>
</select>
<input type="button" name="go" value="Value Selected"
onclick="alert(document.my form.opttw o.options[ document.m yform.optt wo.selecte dIndex].va lue);">
</div></form>
with the following JS
function setOptions(chosen) {
var selbox = document.myform.opttwo;
selbox.options.length = 0;
if (chosen == " ") {
selbox.options[selbox.opti ons.length ] = new Option('Please select Nurse or Doctor first',' ');
}
if (chosen == "1") {
selbox.options[selbox.opti ons.length ] = new Option('first choice - option one','oneone');
selbox.options[selbox.opti ons.length ] = new Option('first choice - option two','onetwo');
}
if (chosen == "2") {
selbox.options[selbox.opti ons.length ] = new Option('second choice - option one','twoone');
selbox.options[selbox.opti ons.length ] = new Option('second choice - option two','twotwo');
}
}
So where would I then specify the URL as the JS in the second part contains content for an alert which Im not certain how to change
<form name="myform"><div align="center">
<select name="optone" size="1"
onchange="setOptions(docum
<option value=" " selected="selected"> </option>
<option value="1">A</option>
<option value="2">B</option>
</select><br /> <br />
<select name="opttwo" size="1">
<option value=" " selected="selected">Please
</select>
<input type="button" name="go" value="Value Selected"
onclick="alert(document.my
</div></form>
with the following JS
function setOptions(chosen) {
var selbox = document.myform.opttwo;
selbox.options.length = 0;
if (chosen == " ") {
selbox.options[selbox.opti
}
if (chosen == "1") {
selbox.options[selbox.opti
selbox.options[selbox.opti
}
if (chosen == "2") {
selbox.options[selbox.opti
selbox.options[selbox.opti
}
}
So where would I then specify the URL as the JS in the second part contains content for an alert which Im not certain how to change
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Excellent, thank you I understand how it works now
ASKER
Just as an additional
For a new window using onclick="window.open
but when using onclick="window.location - for no new window it does not appear to work - any idea?
For a new window using onclick="window.open
but when using onclick="window.location - for no new window it does not appear to work - any idea?
ASKER
Sorry should of been
onclick="window.location.h ref
onclick="window.location.h