Solved: Javascript enable visible hidden list/menu drop down and text field

Currently, if a check box is clicked, a list/menu (by default is hidden) becomes visible and a user can select a number. That number is multiplied (by 25) and passed on to the text field.

What I am trying to accomplish is this:

1. Text field (Total1) will become hidden and will have a default value of 0.00.
2. If the check box (chk1) is now clicked, the list/menu (Select1) appears as well as the text field (Total1).
3. The amount in the text field (Total1) should include a ".00" at the end. Right now, if the user selects 1, the text field (Total1) displays 25. I would like to see 25.00 instead.
4. If a user changes their mind and unchecks the check box, Select 1 and Total1 disappear. Total1 must equal 0.00 if this option is selected.

Thank you.

<html>
<head>
<script language="javascript" type="text/javascript">
function showBox1 (it, box) {
  var vis = (box.checked) ? "visible" : "hidden";
  document.getElementById(it).style.visibility = vis;
}
</script>
</head>
 
<body>
 
Click here to enable<input name="chk1" type="checkbox" id="chk1" onclick="showBox1('Select1', this)">
<select name="Select1" onchange="Total1.value=this.value*25" style="visibility:hidden;">
<option value="0">Select</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
<input name="Total1" type=text size="5" maxlength="5" readonly="readonly" value="0.00">
</body>
</html>

Open in new window