用户注册验证_基于jquery validate

来源:互联网 发布:手机淘宝付款步骤 编辑:程序博客网 时间:2024/06/05 00:18

利用jquery validate提供的验证进行用户注册信息校验

1.引入jquery validate提供的js

2.根据需求进行自定义验证:电话,邮箱,身份证号

Namespace.register('com.courseplatform.module.student.input');//异步加载学校信息function changeArea(areaId) {//根据areaId,获取其下面的所有学校var url = "schoolWithArea";var params = {"areaId" : areaId};$.post(url, params, function(data) {var schools = data;var html = '<option value="" selected>选择学校</option>';for (var i = 0; i < schools.length; i++) {html += '<option value="' +  schools[i].id +'">'+ schools[i].name + '</option>';}$("#${pageId}school").html(html);}, "json");}com.courseplatform.module.student.input={doSave : function(){if(!$.jxy.validate.valid("${pageId}theForm")){return false;}//异步提交表单数据var id=$("#studentId").val();if($("#addType").val()==''){$("#addType").val("0");}var formData = $("#${pageId}theForm").serialize();var loadIndex = $.jxy.layer.load();$.ajax({ type: "POST",  url: "${path}/bd/student/save",  data: formData,  success: function(data){  if($("#addType").val()=='1'){//快速注册  $.jxy.layer.success();  setTimeout("window.location='${path}/lo/login/index';",2000);  }else{//新增用户    setTimeout("window.location='${path}/bd/student/saveSuccess?id="+data+"';",2000);  }  }});}}//身份证验证$(document).ready(function(){$(".headeruser a").remove();jQuery.validator.addMethod("isPhone", function(value, element) {    var length = value.length;    return this.optional(element) || ((length == 11 && /^(((13[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1}))+\d{8})$/.test(value))|| (/^((0\d{2,3})-)?(\d{7,8})(-(\d{3,}))?$/.test(value)));    }, "请输入正确的手机号码或座机号");jQuery.validator.addMethod("stringCheck", function(value, element) {          return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);      }, "只能包括中文字、英文字母、数字和下划线");jQuery.validator.addMethod("isIdCardNo", function(value, element) {          return this.optional(element) || isIdCardNo(value);      }, "输入的身份证号有误");jQuery.validator.addMethod("isChinese", function(value, element) {                return this.optional(element) || /^[\u0391-\uFFE5a-zA-Z]+$/.test(value);           }, "只能包含中文字符、英文字母"); jQuery.validator.addMethod("isEmail", function(value, element) {                return this.optional(element) || /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z]+$/.test(value);           }, "输入的电子邮箱有误"); function isIdCardNo(num) {    var factorArr = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2, 1);    var parityBit = new Array("1", "0", "X", "9", "8", "7", "6", "5", "4", "3", "2");    var varArray = new Array();    var intValue;    var lngProduct = 0;    var intCheckDigit;    var intStrLen = num.length;    var idNumber = num;    // initialize    if ((intStrLen != 15) && (intStrLen != 18)) {        return false;    }    // check and set value    for (i = 0; i < intStrLen; i++) {        varArray[i] = idNumber.charAt(i);        if ((varArray[i] < '0' || varArray[i] > '9') && (i != 17)) {            return false;        } else if (i < 17) {            varArray[i] = varArray[i] * factorArr[i];        }    }    if (intStrLen == 18) {        //check date        var date8 = idNumber.substring(6, 14);        if (isDate8(date8) == false) {            return false;        }        // calculate the sum of the products        for (i = 0; i < 17; i++) {            lngProduct = lngProduct + varArray[i];        }        // calculate the check digit        intCheckDigit = parityBit[lngProduct % 11];        // check last digit        if (varArray[17] != intCheckDigit) {            return false;        }    }    else {        //length is 15        //check date        var date6 = idNumber.substring(6, 12);        if (isDate6(date6) == false) {            return false;        }    }    return true;}function isDate6(sDate) {    if (!/^[0-9]{6}$/.test(sDate)) {        return false;    }    var year, month, day;    year = sDate.substring(0, 4);    month = sDate.substring(4, 6);    if (year < 1700 || year > 2500) return false    if (month < 1 || month > 12) return false    return true}function isDate8(sDate) {    if (!/^[0-9]{8}$/.test(sDate)) {        return false;    }    var year, month, day;    year = sDate.substring(0, 4);    month = sDate.substring(4, 6);    day = sDate.substring(6, 8);    var iaMonthDays = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]    if (year < 1700 || year > 2500) return false    if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) iaMonthDays[1] = 29;    if (month < 1 || month > 12) return false    if (day < 1 || day > iaMonthDays[month - 1]) return false    return true}var validateOptions = {             rules : {             "name" : {                     required : true,                     maxlength:10,                     isChinese: true                 },"birthDate":{ required : true                 },                 "parentPhone1" : {                     required : true,                     isPhone : true                 },                 "parentPhone2" : {                     isPhone : true                 },                 "identityCard" : {                     required:true,                     isIdCardNo:true,                     remote:{                         url: "${path}/bd/student/idCardValidate",                         type: "POST",                         dataType: 'json',                         data: {                         identityCard: function() {                 return $("#identityCard").val();                     },                                             id: function() {                 return $("#studentId").val();                     }                      }                     }                 },                 "email" : {                 required: true,                 email: true,                 isEmail: true                 },                 "password": {                     required: true,                     maxlength:25,                     minlength: 5,                     stringCheck: true                 },                 "confirm_password": {                     required: true,                     minlength: 5,                     equalTo: "#password"                 }                             },messages:{"parentPhone1":{required:"请至少填写一位家长联系方式"            },"birthDate":{required:"必须填写学生的出生日期"            },            "confirm_password":{            equalTo:"两次输入的密码不正确"            },            "identityCard":{            remote :"该用户已经注册过"            },            "password":{                        minlength: "密码至少是5个字符串组成"            }}     }     $.jxy.validate.init("${pageId}theForm", validateOptions);});</script></head><body><%@ include file="/business/common/jsp/header.jsp"%><div class="regTit">学生个人信息注册</div><div class="regCon"><div class="regForm"><form method="post" action="save" id="${pageId}theForm"><input type="hidden" id="studentId" value="${student.id}" name="id"><input type="hidden" id="addType"  name="addType" value="${addType}"><div class="formLayout"><div class="formTit"> 姓名:</div><div class="formMain"><input id="name" name="name" maxlength="10" class="required"type="text" value="${student.name}"><span>*</span></div></div><div class="formLayout"><div class="formTit">性别:</div><div class="formMain" id="radio"><label for="nan"><input id="gender_male" value="0" name="sex" type="radio" required="" <c:if test="${student.sex==null or student.sex=='0'}">checked="checked"</c:if>/>男</label><label for="nv"> <input id="gender_female" value="1" name="sex" type="radio"<c:if test="${student.sex=='1'}">checked="checked"</c:if>/>女</label></div></div><div class="formLayout"><div class="formTit">所在学校:</div><div class="formMain"><select onchange="changeArea(this.value)" id="${pageId}area" name="school.area.id" class="selectStyle" style="height: 28px"><option value="">选择所在区</option><c:forEach items="${areas}" var="area"><option value="${area.id }" <c:if test='${student.school.area.id eq area.id}'>selected="selected"</c:if>>${area.name}</option></c:forEach></select> <select id="${pageId}school" name="school.id" required="" style="height: 28px"><option value="" selected >选择学校</option><c:forEach items="${schools}" var="school"><option value="${school.id}" <c:if test='${student.school.id eq school.id}'>selected="selected"</c:if> >${school.name}</option></c:forEach></select><span>*</span></div></div><div class="formLayout"><div class="formTit">出生日期:</div><div class="formMain"><div style="display:inline-block"><jxy:dateSelect name="birthDate"  id="birthDate" dateFmt="yyyy-MM-dd" dateValue="${student.birthDate}" styleClass="required"></jxy:dateSelect></div><span>*</span></div></div><div class="formLayout"><div class="formTit">家长电话1:</div><div class="formMain"><input id="parentPhone1" type="text" name="parentPhone1" maxlength="25" class="required" value="${student.parentPhone1}"/><span>*</span></div></div><div class="formLayout"><div class="formTit">家长电话2:</div><div class="formMain"><input id="parentPhone2" type="text" maxlength="25" name="parentPhone2" value="${student.parentPhone2}"/></div></div><div class="formLayout"><div class="formTit">身份证号:</div><div class="formMain"><input id="identityCard" maxlength="25" name="identityCard" class="required" type="text" value="${student.identityCard}" /><span>*</span></div></div><div class="formLayout"><div class="formTit">电子邮箱:</div><div class="formMain"><input id="email" name="email" maxlength="50" class="required email" type="text" value="${student.email}" /><span>*</span></div></div><c:if test="${student==null}"><div class="formLayout"><div class="formTit">密码:</div><div class="formMain"><input id="password" name="password" minlength="5" maxlength="25" class="required" type="password"><span>*</span></div></div><div class="formLayout"><div class="formTit">确认密码:</div><div class="formMain"> <input id="confirm_password" name="confirm_password" minlength="5" maxlength="25" class="required" equalto="#password" type="password"><span>*</span></div></div></c:if></form></div></div><div class="regFormSubmit" style="text-align: center;"><a href="javascript:void(0);" onclick="com.courseplatform.module.student.input.doSave();" style="display: inline-block;">注册</a><a href="${path}/lo/login/index" style="display: inline-block;margin-left:20px;">返回</a></div>


1 0
原创粉丝点击