Full version: jsB@nk » Form » Validation » Extreme Form Field Validator
URL: https://www.javascriptbank.com/extreme-form-field-validator.html
Handle and precess all of your form field validations using just one script. This JavaScript can verify numeric strings; monitor the status of the CapsLock state; verify empty strings, numeric, date, alphabetical, or e-mail fields value; confirm passwords; verify the formatting of phone numbers; monitor the minimum/maximum numbers of form input characters. Includes language-independent error messages and displays error messages in a div or using an alert box.
Full version: jsB@nk » Form » Validation » Extreme Form Field Validator
URL: https://www.javascriptbank.com/extreme-form-field-validator.html
<style>#errordiv { border: 1px solid red; background-color: #FFAFAF; display: none; width: 50%; margin: 5px; padding: 5px;}.required { background-color: #CC4444;}.required:focus { background-color: #fff; border: 1px solid #f00;}.checkit { background-color: #E0E5EF;}</style>
<script type="text/javascript" src="chkform.js"></script><script type="text/javascript">function configureValidation(f,alerttype){ f.firstname.isAlphaNumeric = true; f.lastname.isAlphaNumeric = true; f.email.isEmail = true; f.phone.isPhoneNumber = true; f.birthday.isDate = true; f.postalcode.isEmpty = true; f.password1.isLengthBetween = [4,255]; f.password2.isMatch = f.password1.value; f.comments.optional = true; var preCheck = (!f.infohtml.checked && !f.infocss.checked && !f.infojs.checked) ? errormsg[0] : null; return validateForm(f, preCheck, 'required', alerttype);}</script>
<div><form action="#" method="post" onsubmit="return configureValidation(this,3)" onreset="confirm(errormsg[99])"><table class="formtable"><tr><td>First Name:</td><td><input class="checkit" type="text" id="First name" name="firstname" value="" class="text"></td></tr><tr><td>Last Name:</td><td><input class="checkit" type="text" id="Last name" name="lastname" value="" class="text"></td></tr><tr><td>Email:</td><td><input class="checkit" type="text" id="Email" name="email" value="" class="text"></td></tr><tr><td>Email Preferred:</td><td><select name="emailpreferred"><option value="text">Text</option><option value="html">HTML</option><option value="flash">Flash</option></select></td></tr><tr><td>Phone: (US only) </td><td><input class="checkit" type="text" id="Phone" name="phone" value="000-000-0000" class="text"></td></tr><tr><td>Birthday:</td><td><input class="checkit" type="text" id="Birthday" name="birthday" value="mm-dd-yyyy" class="text"></td></tr><tr><td>Gender:</td><td>Male:<input type="radio" name="gender" value="male" class="radio" checked="checked"> Female:<input type="radio" name="gender" value="female" class="radio"></td></tr><tr><td>Password:</td><td><input class="checkit" onKeyPress="checkCapsLock( event )" id="Password" type="password" name="password1" value="" class="text"></td></tr><tr><td>Re-Enter:</td><td><input class="checkit" onKeyPress="checkCapsLock( event )" id="Password again" type="password" name="password2" value="" class="text"></td></tr><tr><td>Postal Code</td><td><input class="checkit" name="postalcode" type="text" id="Postal code" onKeyPress="javascript:checkNumber(this);" onKeyUp="javascript:checkNumber(this);"></td></tr><tr><td colspan="2">Select one or more of the following:</td></tr><tr><td colspan="2">HTML:<input type="checkbox" name="infohtml" value="true" class="checkbox"> CSS:<input type="checkbox" name="infocss" value="true" class="checkbox"> JavaScript:<input type="checkbox" name="infojs" value="true" class="checkbox"></td></tr><tr><td>Comments:</td><td><textarea id="Comment" name="comments" class="text" cols="20" rows="4"></textarea></td></tr></table><div id="errordiv"> </div><div><input type="submit" name="submit" value="Submit" class="button"> <input type="reset" name="reset" value="Reset" class="button"></td></form></div>
/javascript/form/Extreme_Form_Field_Validator/chkform.js