formValidation验证,记录

<div class="modal fade" id="ajaxForm" tabindex="-1" role="dialog" aria-labelledby="ajaxFormLabel" aria-hidden="true">
							<div class="modal-dialog">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
										<h4 class="modal-title" id="ajaxFormLabel">模态框(Modal)标题</h4>
									</div>
									<div class="modal-body">
										<form id="defaultForm" class="form-horizontal">
											<div class="form-group">
												<label class="col-lg-3 control-label">用户名</label>
												<div class="col-lg-5">
													<input type="text" class="form-control" name="userName" />
												</div>
											</div>
											<div class="form-group">
												<label class="col-lg-3 control-label">密码</label>
												<div class="col-lg-5">
													<input type="password" class="form-control" name="userPwd" />
												</div>
											</div>
											<div class="form-group">
												<label class="col-lg-3 control-label">手机号码</label>
												<div class="col-lg-5">
													<input type="text" class="form-control" name="telephone" />
												</div>
											</div>
											<div class="form-group">
												<label class="col-lg-3 control-label">邮箱</label>
												<div class="col-lg-5">
													<input type="text" class="form-control" name="email" />
												</div>
											</div>
											<div class="form-group">
												<label class="col-lg-3 control-label">角色</label>
												<div class="col-lg-5">
													<select class="form-control" id="jues">
														<option value="0" selected>请选择</option>
													</select>
												</div>
											</div>
											<div class="form-group">
												<div class="col-lg-3"></div>
												<div class="col-lg-5 text-right">
													<button type="submit" class="btn btn-primary">确定</button>
													<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
												</div>
											</div>
										</form>
									</div>
								</div>
								<!-- /.modal-content -->
							</div>
							<!-- /.modal -->
						</div>

引用formValidation.min.js和bootstrap.min.js(带formValidation);

验证

$('#defaultForm')
        .formValidation({
            message: '您输入的内容无效',
            icon: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                userName: {
                    message: '用户名无效',
                    validators: {
                        notEmpty: {
                            message: '用户名不能为空'
                        },
                        stringLength: {
                            min: 2,
                            max: 30,
                            message: '姓名必须大于2个字小于30个字'
                        },
						remote:{
							type:"get",
							url:localStorage.getItem("urlBase")+"/user/username",
							message:'此用户名已存在!',
							delay:2000
						}
                    }
                },
                userPwd: {
                    message: '密码格式不正确',
                    validators: {
                        notEmpty: {
                            message: '密码不能为空'
                        },
                        stringLength: {
                            min: 5,
                            max: 30,
                            message: '密码的长度必须大于5'
                        },
                    }
                },
                telephone: {
                    message: '手机号码无效',
                    validators: {
                        regexp: {
                            regexp: /^1[0-9]{10}$/,
                            message: '请输入有效的手机号'
                        }
                    }
                },
                email: {
                    validators: {
                        emailAddress: {
                            message: '邮箱地址无效'
                        }
                    }
                }
            }
        })
        .on('success.form.fv', function (e) {
            // Prevent form submission
            e.preventDefault();
//zidingyi
 });

js下载地址:

点击打开链接


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值