Dynamic <Selects> and Eval()

RISTMO · Sep 27, 2005

This script works pretty well, but it's not quite perfect.

When any of the first three radio boxes are chosen, a "bach" dropdown is created, and when one of the second three's chosen, it creates a "mast" dropdown.

It even sets the default selected value to 2 or 5 (as coded on lines 4 and 5). However, line 10 is supposed to override the defaults to save the last selected value from each drop down separately in case the user goes from "bach" to "mast" to "bach" again or vice versa.

The only thing I can come up with is that eval can't be used to set a variable name how I'm doing it, because it reads it just fine a couple lines below using the same (but reversed) code. Any ideas? Surely there's a way to do this!

Thanks!
Rick

Code:

<script type="text/JavaScript">
var prev_dropdown;
var bach = '<select name="major"><option value="ACCT">Accounting</option><option value="ART">Art</option><option value="BIBS">Biblical Studies</option><option value="BIOL">Biology</option><option value="BUAD">Business Administration</option><option value="BUAD">Business Administration</option><option value="MUCO">Choral Music</option><option value="CHMN">Christian Ministries</option><option value="CHST">Christian Studies</option><option value="MUCH">Church Music</option><option value="COMA">Communication</option><option value="CISC">Computer Information Science</option><option value="COSC">Computer Science</option><option value="CRJS">Criminal Justice</option><option value="ENGL">English</option><option value="FINA">Finance</option><option value="GENS">General Studies</option><option value="HCMG">Health Care Management</option><option value="HIST" selected>History</option><option value="INTA">Interdisciplinary Academic</option><option value="INTS">Interdisciplinary Academic Studies</option><option value="KNES">Kinesiology</option><option value="MANA">Management</option><option value="MISM">Management Information Systems</option><option value="MRKT">Marketing</option><option value="MATH">Mathematics</option><option value="MUSI">Music</option><option value="MUSB">Music Business</option><option value="NASC">Natural Sciences</option><option value="ORPF">Organ Performance</option><option value="PHIL">Philosophy</option><option value="PIPF">Piano Performane</option><option value="POLS">Political Science</option><option value="PSYC">Psychology</option><option value="SOCI">Sociology</option><option value="THCMP">Theory and Composition</option><option value="THCMP">Theory/Composition</option><option value="UNDC">Undecided</option><option value="VOPF">Voice Performance</option></select>';
var bach_cur = 2;
var mast_cur = 5;
var mast = '<select name="major"><option value="BUAD">Business Administration</option><option value="CHED">Christian Education</option><option value="EDUC">Education</option><option value="EDSC">Education in School Counseling</option><option value="HIED">Higher Education</option><option value="LIBA">Liberal Arts</option><option value="OMAN">Organizational Management</option><option value="PFDV">Professional Development</option></select>';
function updateDegree(that,Rs){
	if(that.checked){
		if(prev_dropdown==Rs){
			eval(Rs+"_cur")=document.Step3.major.selectedIndex;
		}
		document.getElementById('degreeHolder').innerHTML=eval(Rs);
		document.Step3.major.selectedIndex=eval(Rs+"_cur");
		prev_dropdown=Rs;
	}
}
</script>
<form name="Step3" method="post" action="step_3_save.asp">

<table width="640" align="center" cellpadding="2" cellspacing="0" class="formBackground">
<tr><td colspan="3">What will be your academic program?</td></tr>
<tr><td colspan="3"><b>Bachelor's Degree Programs</b></td></tr>
<tr><td>&nbsp;</td>
	<td><input type="radio" name="degree" onChange="updateDegree(this, 'bach')" value="" checked /></td>
	<td>Undergraduate - I have graduated (or will graduate soon) from a secondary/high school</td>
</tr>
<tr><td>&nbsp;</td>
	<td><input type="radio" name="degree" onChange="updateDegree(this, 'bach')" value="" checked /></td>
	<td>Undergraduate / Transfer - I am trasnferring from another U.S.A. college or university.</td>

</tr>
<tr><td>&nbsp;</td>
	<td><input type="radio" name="degree" onChange="updateDegree(this, 'bach')" value="" checked /></td>
	<td>Undergraduate / College of Adult Education - I have graduated from a secondary / high school, and I am at least 25 years of age.</td>
</tr>
<tr><td colspan="3"><b>Master's Degree Programs</b></td></tr>
<tr><td>&nbsp;</td>
	<td><input type="radio" name="degree" onChange="updateDegree(this, 'mast')" value="" checked /></td>
	<td>Graduate - I have graduated (or will graduate soon) from a college or university.</td>
</tr>

<tr><td>&nbsp;</td>
	<td><input type="radio" name="degree" onChange="updateDegree(this, 'mast')" value="" checked /></td>
	<td>Graduate Transfer - I am transferring from another college or university graduate program.</td>
</tr>
<tr><td>&nbsp;</td>
	<td><input type="radio" name="degree" onChange="updateDegree(this, 'mast')" value="" checked /></td>
	<td>MBA/MAOM Bridge Program - I have completed a three-year bachelor degree program outside the U.S.A.</td>
</tr>
<tr><td colspan="3">&nbsp;</td></tr>
<tr><td colspan="3">What will be your field-of-study?</td></tr>
<tr><td>&nbsp;</td>
	<td colspan="2" id="degreeHolder"></td>
</tr>
</table>
<p align="center">
<input name="Submit" type="submit" class="formElement" value="&lt;&lt; Back" />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
<input name="Submit" type="submit" class="formElement" value="Save &amp; Continue &gt;&gt;" />
</p>
</form>

RISTMO Designs: Rockwall Web Design
Arab Church: Arabic Christian Resources
Genuine Autos: Kaufman Chevrolet & Pontiac Dealer
Rick Morgan's Official Website

LFI · Sep 27, 2005

Can you just replace:

eval(Rs+"_cur")=document.Step3.major.selectedIndex;

...with:

Code:

 if(RS == 'mast')
  mast_cur = document.Step3.major.selectedIndex;
 else //RS == 'bach'
  bach_cur = document.Step3.major.selectedIndex;

--Dave

LFI · Sep 27, 2005

Oops... change my RS to R[red]s[/red]. I mis-capitalized.

LFI · Sep 27, 2005

Still... there are several other problems with your script.

Here is an updated version of the above that work. I have tried to highlight in red all the changes. I would explain more, but I have to leave. If there's something you don't understand, please ask and I will get to it tomorrow:

Code:

<html>
<head>
<script type="text/JavaScript">
var prev_dropdown[red] = 'mast';
var curr_dropdown = 'bach';[/red]

var bach = '<select name="major" [red]onchange="saveIndex();"[/red]><option value="ACCT">Accounting</option><option value="ART">Art</option><option value="BIBS">Biblical Studies</option><option value="BIOL">Biology</option><option value="BUAD">Business Administration</option><option value="BUAD">Business Administration</option><option value="MUCO">Choral Music</option><option value="CHMN">Christian Ministries</option><option value="CHST">Christian Studies</option><option value="MUCH">Church Music</option><option value="COMA">Communication</option><option value="CISC">Computer Information Science</option><option value="COSC">Computer Science</option><option value="CRJS">Criminal Justice</option><option value="ENGL">English</option><option value="FINA">Finance</option><option value="GENS">General Studies</option><option value="HCMG">Health Care Management</option>[red]<option value="HIST">History</option>[/red]<option value="INTA">Interdisciplinary Academic</option><option value="INTS">Interdisciplinary Academic Studies</option><option value="KNES">Kinesiology</option><option value="MANA">Management</option><option value="MISM">Management Information Systems</option><option value="MRKT">Marketing</option><option value="MATH">Mathematics</option><option value="MUSI">Music</option><option value="MUSB">Music Business</option><option value="NASC">Natural Sciences</option><option value="ORPF">Organ Performance</option><option value="PHIL">Philosophy</option><option value="PIPF">Piano Performane</option><option value="POLS">Political Science</option><option value="PSYC">Psychology</option><option value="SOCI">Sociology</option><option value="THCMP">Theory and Composition</option><option value="THCMP">Theory/Composition</option><option value="UNDC">Undecided</option><option value="VOPF">Voice Performance</option></select>';
[red]//removed 'selected' from HIST option[/red]

[red]var curr = new Array();
curr['bach_cur'] = 0;
curr['mast_cur'] = 0;[/red]

var mast = '<select name="major" [red]onchange="saveIndex();"[/red]><option value="BUAD">Business Administration</option><option value="CHED">Christian Education</option><option value="EDUC">Education</option><option value="EDSC">Education in School Counseling</option><option value="HIED">Higher Education</option><option value="LIBA">Liberal Arts</option><option value="OMAN">Organizational Management</option><option value="PFDV">Professional Development</option></select>';
function updateDegree(that,Rs){
  if(prev_dropdown==Rs[red] && curr_dropdown != Rs[/red]){
    [red]document.getElementById('degreeHolder').innerHTML = eval(Rs);
    document.Step3.major.selectedIndex = curr[Rs+'_cur'];
    prev_dropdown = curr_dropdown
    curr_dropdown = Rs;[/red]
   }
   [red]//deleted the rest of this fxn[/red]
}

[red]function saveIndex()
{
 curr[curr_dropdown+"_cur"] = document.Step3.major.selectedIndex;
}[/red]
</script>
</head>
<body>
<form name="Step3" method="post" action="step_3_save.asp">

<table width="640" align="center" cellpadding="2" cellspacing="0" class="formBackground">
<tr><td colspan="3">What will be your academic program?</td></tr>
<tr><td colspan="3"><b>Bachelor's Degree Programs</b></td></tr>
<tr><td>&nbsp;</td>
    <td><input type="radio" name="degree" onClick="updateDegree(this, 'bach')" value="" checked/></td>
[red]<!-- the above is now the ONLY 'checked' radio button to begin with -->[/red]
    <td>Undergraduate - I have graduated (or will graduate soon) from a secondary/high school</td>
</tr>
<tr><td>&nbsp;</td>
    <td><input type="radio" name="degree" onClick="updateDegree(this, 'bach')" value="" /></td>
    <td>Undergraduate / Transfer - I am trasnferring from another U.S.A. college or university.</td>

</tr>
<tr><td>&nbsp;</td>
    <td><input type="radio" name="degree" onClick="updateDegree(this, 'bach')" value="" /></td>
    <td>Undergraduate / College of Adult Education - I have graduated from a secondary / high school, and I am at least 25 years of age.</td>
</tr>
<tr><td colspan="3"><b>Master's Degree Programs</b></td></tr>
<tr><td>&nbsp;</td>
    <td><input type="radio" name="degree" onClick="updateDegree(this, 'mast')" value="" /></td>
    <td>Graduate - I have graduated (or will graduate soon) from a college or university.</td>
</tr>

<tr><td>&nbsp;</td>
    <td><input type="radio" name="degree" onClick="updateDegree(this, 'mast')" value="" /></td>
    <td>Graduate Transfer - I am transferring from another college or university graduate program.</td>
</tr>
<tr><td>&nbsp;</td>
    <td><input type="radio" name="degree" onClick="updateDegree(this, 'mast')" value="" /></td>
    <td>MBA/MAOM Bridge Program - I have completed a three-year bachelor degree program outside the U.S.A.</td>
</tr>
<tr><td colspan="3">&nbsp;</td></tr>
<tr><td colspan="3">What will be your field-of-study?</td></tr>
<tr><td>&nbsp;</td>
    <td colspan="2" id="degreeHolder">
[red]<script>document.write(bach);</script>[/red]
    </td>
</tr>
</table>
<p align="center">
<input name="Submit" type="submit" class="formElement" value="&lt;&lt; Back" />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
<input name="Submit" type="submit" class="formElement" value="Save &amp; Continue &gt;&gt;" />
</p>
</form>
</body>
</html>

--Dave

kaht · Sep 28, 2005

Dave pretty much has this one covered, but I figured I'd tell ya what was wrong with your original eval. Eval will parse an expression and run it as though it was hard coded into your program. When you tried to eval the variable you weren't doing anything with it, and javascript thought you were trying to set the eval() function equal to something. Which is really no different than writing something like:

Code:

alert("hi")=true

We can't set the alert function equal to something. So, to solve this issue you would have needed to change this:

Code:

eval(Rs+"_cur")=document.Step3.major.selectedIndex;

to this:

Code:

eval(Rs+"_cur[COLOR=red][b]=document.Step3.major.selectedIndex[/b][/color]");

-kaht

...looks like you don't have a job, so why don't you get out there and feed Tina.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Dynamic <Selects> and Eval()

RISTMO

Programmer

LFI

Programmer

LFI

Programmer

LFI

Programmer

kaht

Programmer

Similar threads

Part and Inventory Search

Sponsor

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Dynamic &lt;Selects&gt; and Eval()

RISTMO

Programmer

LFI

Programmer

LFI

Programmer

LFI

Programmer

kaht

Programmer

Similar threads

Log in

Part and Inventory Search

Sponsor

Dynamic <Selects> and Eval()