PDA

View Full Version : javaScript dynamic drop down menu


tawanda
07-29-2005, 10:59 AM
Hello :boogy:
I am trying to make a dynamic drop down list for a form to be sent through email. The drop down list works fine while viewing the web page, however when I try to email the form the second drop down option shows no value. I am using this code

<script type ="text/javascript" language="JavaScript">
var FormName = "shortForm";
var init = " ";

var ALHArray = new Array();
ALHArray[0] = "--Select--";
ALHArray[1] = "1111041";
ALHArray[2] = "2263041";
ALHArray[3] = "2451041";

function Initialize() {
eval('document.' + FormName + '.secondary.options.length = 0');
eval('document.' + FormName + '.secondary.options[0] = new Option(init,"")');}

function MakeSecondary() {
var v = new String();
var plen = 0;
eval('plen = document.' + FormName + '.primary.length');
for(var i = 0; i < plen; i++) {
var theone = false;
eval('theone = document.' + FormName + '.primary.options[i].selected');
if(theone == true) {
eval('v = document.' + FormName + '.primary.options[i].value');
i = plen;
}
}
// The following method of removing non-alphanumerics is used instead of regular expressions, to accomodate IE/Mac.
var vlen = v.length;
var ts = new String();
for(var vi = 0; vi < vlen; vi++) {
var vs = v.substr(vi,1);
if((vs >= 'A' && vs <= 'Z') || (vs >= 'a' && vs <= 'z') || (vs >= '0' && vs <= '9')) {
ts += vs;
}
}
v = ts;
var Splitter = "|";
if(v.length < 1) { Initialize(); return; }
var arrayLength = eval(v + "Array.length");
eval('document.' + FormName + '.secondary.options.length = 0');
for(var i = 0; i < arrayLength; i++ ) {
var iArray = new Array();
eval("iArray = " + v + "Array[i].split(Splitter)");
if(iArray.length < 2) { iArray[1] = ""; }
eval('document.' + FormName + '.secondary.options[i] = new Option(iArray[0],iArray[1])');
}

}





and the html looks like

<select name="primary" onChange="javascript:MakeSecondary(1)">
<option value = "" selected>--Select--</option>
<option value = "ALH">ALH</option>
<option value = "COM">COM</option>
<option value = "ECO">ECO</option>
<option value = "EDU">EDU</option>
<option value = "ENG">ENG</option>
<option value = "HIS">HIS</option>
<option value = "MAT">MAT</option>
<option value = "NUR">NUR</option>
<option value = "PSY">PSY</option>
<option value = "SPE">SPE</option>
<option value = "CTD">CTD</option>
</select>

<select name="secondary">
<option></option>
<option></option>
</select>





I am sure the value for the secondary option is stored somewhere within the makeSecondary function and I thought maybe I could return it to a value somewhere so that I can send it in the email.... maybe??? Any help is appriciated!

thanks

tawanda
07-29-2005, 12:43 PM
To be more clear...

I have two drop down menus. The second one changes depening on the value of the first one. The second one is changing in such a way that when I send the information from the form, it's value is blank. Is there anyway I can get that info from a variable in my script, or any other means of trickery, or must I start over?

Thanks

tawanda
07-29-2005, 04:23 PM
neither one of these work but am I on the right track?

eval(('document.' + FormName + '.secondary.value') = ('Option(iArray[0], iArray[1]'))

or

document.shortForm.secondary.value = Option(iArray[0], iArray[1]);

Jon Hanlon
07-31-2005, 06:45 PM
Why are you using eval()? Steer clear of it.
Do a google search on "dynamic drop down" for instruction.

tawanda
08-01-2005, 02:38 PM
Thank you for your advice. I found something close to what I need...
If I have a select and the option value is set to something like

<select name="Classes">
<option value="-1">-- Select State --
<option value="0">ALH</option>
<option value="1">COM</option>
<option value="2">MAT</option>
</select>

Is there any way that I can change the ALH value from 0 to ALH using javascript?

So that when I submit the form is shows up as ALH instead of 0???

Thanks!

Jon Hanlon
08-01-2005, 05:52 PM
<select name="Classes">
<option value="">-- Select State --
<option value="ALH">ALH</option>
<option value="COM">COM</option>
<option value="MAT">MAT</option>
</select>