Link prompted by dependant drop down

**LauraWord** · 11-30-2009, 06:15 PM

I have a form that has several dependant drop down boxes and copies all of the selections to a text box so you can paste the results to another location. I am using this in training to simulate the selections they will make in the actual system.

I would like for the last selection to be a link instead of another drop-down box so that I can direct them to more information (a step by step) based on their selections.

I am including a scaled down version of my code below. It actually has 8 possible selections for code 1 and 83 for code 6.

I have looked at http://www.outfront.net/tutorials_02/faq.htm#DropDown but am not sure how to adapt it to work with the dependant boxes.

Any help would be greatly appreciated!

Code:

<html>

<head>

<script type="text/javascript">
<!--
var arrItems1 = new Array();
var arrItemsGrp1 = new Array();

arrItems1[1] = "Selection 1";
arrItemsGrp1[1] = 1


var arrItems2 = new Array();
var arrItemsGrp2 = new Array();

arrItems2[12] = "Selection 1";
arrItemsGrp2[12] = 1


var arrItems3 = new Array();
var arrItemsGrp3 = new Array();

arrItems3[42] = "Selection 1";
arrItemsGrp3[42] = 12


var arrItems4 = new Array();
var arrItemsGrp4 = new Array();

arrItems4[133] = "Selection 1";
arrItemsGrp4[133] = 42


var arrItems5 = new Array();
var arrItemsGrp5 = new Array();

arrItems5[244] = "Selection 1";
arrItemsGrp5[244] = 133


var arrItems6 = new Array();
var arrItemsGrp6 = new Array();

arrItems6[500] = "http";
arrItemsGrp6[500] = 244

function selectChange(control,nu){
var frm=control.form;
var sel=frm['Choice'+nu];
var iary=window['arrItems'+nu];
var gary=window['arrItemsGrp'+nu];
var cnt=1;
while (frm['Choice'+cnt]){
if (cnt>=nu){
while (frm['Choice'+cnt].firstChild){
frm['Choice'+cnt].removeChild(frm['Choice'+cnt].firstChild);
}
}
cnt++;
}
var myEle=document.createElement("option");
myEle.appendChild(document.createTextNode("[SELECT ONE]"));
myEle.setAttribute("value","0");
sel.appendChild(myEle);
for (var x = 0 ; x < iary.length ; x++ ) {
if ( gary[x]==control.value ) {
myEle = document.createElement("option");
myEle.setAttribute("value",x);
myEle.appendChild(document.createTextNode(iary[x]));
sel.appendChild(myEle);
}
}
}
// -->
</script>
<script language='Javascript'>
function doact(d)
{
var doc = eval("document.form."+d);
cp = doc.createTextRange();
doc.focus();
doc.select();
cp.execCommand("Copy");
}

function FP_popUpMsg(msg) {//v1.0
alert(msg);
}
</script>
<script language='Javascript'>
function listChoices() {
var textStr='';
var aSel=document.getElementsByTagName('select');
for(var i=0; i<aSel.length; i++) {
    if(aSel.length>1) {
        textStr+=aSel.name+": "+aSel[aSel.selectedIndex].text+",";
        }
    }
document.form.text1.value=textStr;
}
</script>
</HEAD>

<BODY>

<form name=form>
<div align="center">
<table border="2" width="790" id="table1" bordercolor="#64367C">
<tr>
<td width="778" align="left" colspan="2">
</td>
<tr>
<td width="552" align="left">
<font size="2" face="MS Sans Serif"> Choice 1:<font size="2" face="MS Sans Serif">
<select id="Choice0" name="Choice0" onchange="listChoices(); selectChange(this, 1);">
<option value="0" selected>[SELECT]</option>
<option value="1">Selection 1</option>
</select></font></font></td>
<td width="220" align="center" onclick="FP_popUpMsg('More Info')">
<font face="MS Sans Serif" size="2" color="#FF0000">*</font><font face="MS Sans Serif" size="2" color="#0000FF">
<u>
Tell me more</u></font></td>
<tr>
<td width="552" align="left">
<font size="2" face="MS Sans Serif">    Code 2: 
<select id="secondChoice" name="Choice1" onchange="listChoices(); selectChange(this, 2); "></select></font></td>
<td width="220" align="center" rowspan="5">
<TEXTAREA name="text1" cols="24" rows="5">
Selections will populate here.
</TEXTAREA><input onclick="doact('text1')" type="button" value="Copy">
</td>
</tr>
<tr>
<td width="552" align="left">
<font size="2" face="MS Sans Serif">    Code 3: 
<select id="thirdChoice" name="Choice2" onchange="listChoices(); selectChange(this, 3);"></select></font></td>
</tr>
<tr>
<td width="552" align="left">
<font size="2" face="MS Sans Serif">    Code 4: 
<select id="fourthChoice" name="Choice3" onchange="listChoices(); selectChange(this, 4);"></select></font></td>
</tr>
<tr>
<td width="552" align="left">
<font face="MS Sans Serif" size="2">    Code 5: </font> <font size="3" face="Courier">
<select id="fifthChoice" name="Choice4" onchange="listChoices(); selectChange(this, 5);" size="1"></select></font></td>
</tr>
<tr>
<td width="552" align="left">
<p><font face="MS Sans Serif" size="2">    Code 6: </font>
<font size="3" face="Courier">
<select id="sixthChoice" name="Choice5" onChange="listChoices(); selectChange(this, 6); alert('Reminder') " size="1"></select>
</font></p></td>
<tr>
<td width="552" align="left">
<font face="MS Sans Serif" size="2">          Link: </font> <font size="3" face="Courier">
<select id="seventhChoice" name="Choice6"></select></font></td>
<td width="220" align="center">
<font size="2" face="MS Sans Serif">
<a target="_blank" href="reference.htm">Show the Full Spreadsheet</a></a></font></td>
</table>
</div>
</form>

</body>

</html>

**jscheuer1** · 11-30-2009, 09:56 PM

Have you seen:

http://www.dynamicdrive.com/dynamici...ects/index.htm

and:

http://www.dynamicdrive.com/dynamici...menu/index.htm

?

Thread: Link prompted by dependant drop down

Thread Tools

Search Thread

Link prompted by dependant drop down

Bookmarks

Bookmarks

Posting Permissions