Test Select Form Values

Things in BLUE text are required for the form.

Things in GREEN text are "comments" that are not used in the code, except for the JavaScript.

Things in RED text are the variables you can change.

You may copy the code below and use it for your form, changing the variables as necessary.

<html> <!-- ///////////////////////////////////////////////////////
Tutorial Created by the UWP Web Development Team
Visit the Web Training Center
http://www.uwplatt.edu/web/wtc/
/////////////////////////////////////////////////////// -->
<head>
<title>Select Functionality</title>
<script type="text/javascript">
<!-- Start Hide
function getValue()
{

//////////////////////////////////////////////////////////////
// The variable 'msg' will hold the messages we want to
// appear in the message box.
//////////////////////////////////////////////////////////////
var msg = "";

//////////////////////////////////////////////////////////////
// checkSum will keep track of the value of the selected field
//////////////////////////////////////////////////////////////
var checkSum = 0;

//////////////////////////////////////////////////////////////
// The variables test1-4 will check which field is selected
//////////////////////////////////////////////////////////////
var test1 = document.testForm.test.options[0];
var test2 = document.testForm.test.options[1];
var test3 = document.testForm.test.options[2];
var test4 = document.testForm.test.options[3];

//////////////////////////////////////////////////////////////
// Here we check to see which field is selected, and then add
// the value of the selected field to checkSum
//////////////////////////////////////////////////////////////
if (document.testForm.test.options[0].selected == true)
{
   checkSum += parseFloat(document.testForm.test[0].value);
}
else if (document.testForm.test.options[1].selected == true)
{
   checkSum += parseFloat(document.testForm.test[1].value);
}
else if (document.testForm.test.options[2].selected == true)
{
   checkSum += parseFloat(document.testForm.test[2].value);
}
else if (document.testForm.test.options[3].selected == true)
{
   checkSum += parseFloat(document.testForm.test[3].value);
}

//////////////////////////////////////////////////////////////
// Finally, we print out the sum of all the checked fields in
// an alert box.
//////////////////////////////////////////////////////////////
msg += "Selected: " + checkSum;
alert (msg);
}
// End Hide -->

</script>

</head>
<body>

<div class="tableLight" style="width:35%;margin:0 auto;padding:0.5em;border:0.2em solid #000;">
   <strong>Test Select Form Values</strong>
   <form name="testForm" action="">
      <select name="test">
         <option value="10">10</option>
         <option value="20">20</option>
         <option value="30">30</option>
         <option value="40">40</option>
      </select><br />
      <input type="submit" value="Check Values" onclick="javascript:getValue();" />
      <input type="reset" value="Reset" />
   </form>
</div>

</body>
</html>