bootstrap中使用jquery实现数据的校验
1、提交数据给服务器之前先校验数据的合理性。新建一个方法validate_add_form():
function validate_add_form() {
}
function getDepts() {
$("#dept_select").empty();
validate_add_form();
$.ajax({
url:"${APP_PATH}/depts",
type:"get",
success:function(result) {
$.each(result.extend.depts,function() {
var optionEle = $("<option></option>").append(this.deptName).attr("value",this.deptId);
optionEle.appendTo($("#dept_select"));
});
}
});
}
2、使用正则表达式进行页面用户名数据的校验：
function validate_add_form() {
var empName = $("#empName_add_input").val();
var regName = /(^[A-Za-z0-9_-]{6,16}$)|(^[\u4e00-\u9fa5]{2,5}$)/;
if(!regName.test(empName)) {
alert("用户名可以使2-5位中文或者6-16位英文和数字的组合");
}
var email = $("#email_add_input").val();
}
3、校验bootstrap表单中email。
function validate_add_form() {
var empName = $("#empName_add_input").val();
var regName = /(^[A-Za-z0-9_-]{6,16}$)|(^[\u4e00-\u9fa5]{2,5}$)/;
if(!regName.test(empName)) {
alert("用户名可以使2-5位中文或者6-16位英文和数字的组合");
return false;
}
var email = $("#email_add_input").val();
var regEmail = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
if(!regEmail.test(email)) {
alert("邮箱格式不正确");
return false;
}
return true;
}
4、在浏览器中测试程序的正确性。
5、当输入的邮箱错误之后会提示信息
6、当输入错误的用户名之后会提示信息：
7、全部填写正确之后数据保存成功并且跳转到最后一页。
