»
Tiếng AnhTiếng PhápTiếng Việt

In - Kiểm tra dữ liệu của biểu mẫu - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Hạn chế » Kiểm tra dữ liệu của biểu mẫu
URL: https://www.javascriptbank.com/extreme-form-field-validator.html

Kiểm tra dữ liệu của biểu mẫu © JavaScriptBank.comBạn có thể dùng đoạn mã JavaScript này để kiểm tra dữ liệu do người dùng nhập vào trong một biểu mẫu nào đó. Đoạn mã này có thể kiểm tra các điều sau: + Trạng thái của phím CapsLock. + Chuỗi rỗng, số, kí tựthư điện tử. + Xác nhận mật khẩu + Định dạng số điện thoại. + Số lượng kí tự có thể nhập.

Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Hạn chế » Kiểm tra dữ liệu của biểu mẫu
URL: https://www.javascriptbank.com/extreme-form-field-validator.html



CSS
<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>


JavaScript
<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>


HTML
<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>


Files
/javascript/form/Extreme_Form_Field_Validator/chkform.js