Javascripts > Javascript Forms > FormCheck
Script Title: FormCheck
Description: FormCheck is a generic script which will check and verify that mandatory fields are filled in before form submission. If one or more of the required fields are empty. A popup dialog will appear showing the omitted fields.
Example: Available
First Name: Last Name: Sex Male Female Age 0 - 15 15 - 21 21 - 30 31 - 40 41 - 50 51 - 60 Above 60 Address
Credit: Script created by NavSurf
Copy the following code into your <HEAD></HEAD> tags.<script language="JavaScript"> <!-- // Copyright information must stay intact // FormCheck v1.10 // Copyright NavSurf.com 2002, all rights reserved // Creative Solutions for JavaScript navigation menus, scrollers and web widgets // Affordable Services in JavaScript consulting, customization and trouble-shooting // Visit NavSurf.com at http://navsurf.com function formCheck(formobj){ // name of mandatory fields var fieldRequired = Array("FirstName", "LastName", "Sex", "Age", "Address"); // field description to appear in the dialog box var fieldDescription = Array("First Name", "Last Name", "Sex", "Age", "Address"); // dialog message var alertMsg = "Please complete the following fields:\n"; var l_Msg = alertMsg.length; for (var i = 0; i < fieldRequired.length; i++){ var obj = formobj.elements[fieldRequired[i]]; if (obj){ switch(obj.type){ case "select-one": if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == ""){ alertMsg += " - " + fieldDescription[i] + "\n"; } break; case "select-multiple": if (obj.selectedIndex == -1){ alertMsg += " - " + fieldDescription[i] + "\n"; } break; case "text": case "textarea": if (obj.value == "" || obj.value == null){ alertMsg += " - " + fieldDescription[i] + "\n"; } break; default: } if (obj.type == undefined){ var blnchecked = false; for (var j = 0; j < obj.length; j++){ if (obj[j].checked){ blnchecked = true; } } if (!blnchecked){ alertMsg += " - " + fieldDescription[i] + "\n"; } } } } if (alertMsg.length == l_Msg){ return true; }else{ alert(alertMsg); return false; } } // --> </script>
Copy the following code between the <BODY></BODY> tags of your html page.<form name="formcheck" method="POST" action="" onsubmit="return formCheck(this);"> <blockquote> <blockquote> <table border="0" cellpadding="8" cellspacing="0" width="50%"> <tr> <td align="right" nowrap>First Name:</td> <td><input type=text name="FirstName" size="25"></td> </tr> <tr> <td align="right" nowrap>Last Name:</td> <td><input type=text name="LastName" size="25"></td> </tr> <tr> <td align="right" nowrap>Sex</td> <td> <input type="radio" name="Sex" value="Male">Male <input type="radio" name="Sex" value="Female">Female </td> </tr> <tr> <td align="right" valign="top" nowrap>Age</td> <td> <select name="Age" size="7"> <option>0 - 15 <option>15 - 21 <option>21 - 30 <option>31 - 40 <option>41 - 50 <option>51 - 60 <option>Above 60 </select></td> </tr> <tr> <td align="right" valign="top" nowrap>Address</td> <td> <textarea rows="6" name="Address" cols="29"></textarea></td> </tr> <tr> <td class="center" colspan="2"> <input type=submit value="Submit Form"> <input type=reset value="Reset Form"> </td> </tr> </table> </blockquote> </blockquote>
Enter your name and email address to have this script sent right to your Inbox for later viewing. First Name Last Name Email