Forum Moderators: open
I want to have a select list that lets people find the "thing" and get back info related to it.
The problem I'm having with the code below appears to be in the passing of the OPTION VALUE to the JS switch function.
I know the OPTION VALUE, (a "1", "2", "3" or "" empty value) is being passed into the function as I can write it out with-
document.write('Var was:' + n);
So, the function has the right value... but the "switch()" function appears to be failing.
Clues?
PLEASE! DO NOT SUGGEST A COMPLETELY DIFFERENT METHOD OF DOING THIS... I know just about everything can be done 1000 different way. I have other functions and data related to this that are not going to be re-written.
Thanks.
============[ code ]===================
<html>
<head>
<script type="text/javascript" language="javascript">
function showtxt() {
var n = document.forms.myform.mylist.value;
switch (n) {
case 1:
document.getElementById('SizeName').innerHTML = '<b>Small</b>';
break
case 2:
document.getElementById('SizeName').innerHTML = '<b>Medium</b>';
break
case 3:
document.getElementById('SizeName').innerHTML = '<b>Large</b>';
break
default:
document.getElementById('SizeName').innerHTML = '<b>No Size</b>';
}
// uncomment next line to debug
// document.write('Var was:' + n);
}
</script>
</head>
<body>
<!-- Key for sizes: 1=Small 2=Medium 3=Large -->
<form id="myform">
<select name="mylist" size="3">
<option value="1">Miniature Thing</option>
<option value="3">Very Big Thing</option>
<option value="2">Average Thing</option>
<option value="">Other Thing</option>
<option value="1">Little Thing</option>
<option value="3">Huge Thing</option>
<option value="">Other Thing</option>
<option value="2">Medium Size Thing</option>
</select>
<br>
<input type="button" onclick="showtxt()" value="Get Package Size">
</form>
</div>
<div style="width:200px; border:1px solid black; padding: 10px" >
<table>
<tr>
<td><b>Size:</b></td><td id="SizeName"></td>
</table>
</div>
</body>
</html>