Loop through all elements in a form : Elements : Form JAVASCRIPT TUTORIALS


JAVASCRIPT TUTORIALS » Form » Elements »

 

Loop through all elements in a form

















<html>
<head>
<title>Online Survey</title>
<script type="text/javascript" language="javascript">
<!-- //
function CheckCheckboxes(){
    var elLength = document.MyForm.elements.length;

    for (i=0; i<elLength; i++)
    {
        var type = MyForm.elements[i].type;
        if (type=="checkbox" && MyForm.elements[i].checked){
            alert("Form element in position " + i + " is of type checkbox and is checked.");
        }
        else if (type=="checkbox") {
            alert("Form element in position " + i + " is of type checkbox and is not checked.");
        }
        else {
        }
    }
}
// -->
</script>
</head>
<body>
<form action="http://www.navioo.com" method="POST" name="MyForm">
<table width="600">
<tr><th colspan="3" align="center">Online Survey<br /><br /></th>
</tr>
<tr>
 <td>Your Name:</td>
 <td>&nbsp;</td>
 <td><input type="text" name="YourName"/></td></tr>
<tr>
 <td>Your Gender:</td>
 <td>&nbsp;</td>
 <td>
   <input type="radio" name="Gender" value="Male"/>Male<br />
   <input type="radio" name="Gender" value="Female"/>Female<br />
 </td>
</tr>
<tr><td>Which of our consultancy <br />services are you interested in?</td>
 <td align="right">&nbsp;
 </td>
 <td>
   <input type="checkbox" name="XML"/>&nbsp;XML<br />
   <input type="checkbox" name="XSLT"/>&nbsp;XSLT<br />
   <input type="checkbox" name="SVG"/>&nbsp;SVG<br />
   <input type="checkbox" name="XSL-FO"/>&nbsp;XSL-FO<br />
   <input type="checkbox" name="XForms"/>&nbsp;XForms<br />
 </td>
</tr>
<tr>
 <td>Which free gift would you prefer for filling out this survey?</td>
 <td>&nbsp;</td>
 <td>
  <select name="FreeGift">
   <option value="Choice1">Choice 1</option>
   <option value="Choice2">Choice 2</option>
   <option value="Choice3">Choice 3</option>
  </select>
</tr>
<tr>
 <td>Enter your comments in<br />the text box
 </td>
 <td>&nbsp;</td>
 <td><textarea name="Comments" rows="5" cols="50"></textarea></td>
</tr>
<tr>
 <td>&nbsp;</td>
 <td>&nbsp;</td>
 <td><br /><input type="submit" value="Send Form" onclick="CheckCheckboxes()"/></td>
</tr>
</table>
</form>
</body>
</html>







HTML code for linking to this page:

Follow Navioo On Twitter

JAVASCRIPT TUTORIALS

 Navioo Form
» Elements