首页 > 用了jquery验证插件jquery-validation的远程验证,就不能提交表单?

用了jquery验证插件jquery-validation的远程验证,就不能提交表单?

用了jquery验证插件jquery-validation的远程验证,就不能提交表单?

view:



    <form id="register" class="form-horizontal" role="form" method="POST" action="{{ url('/register') }}">
        {!! csrf_field() !!}
        <div class="form-group{{ $errors->has('name') ? ' has-error' : '' }}">
            <label class="col-md-4 control-label">Name</label>
            <div class="col-md-6">
                <input type="text" class="form-control" name="name" id="name" value="{{ old('name') }}">
                @if ($errors->has('name'))
                    <span class="help-block"><strong>{{ $errors->first('name') }}</strong></span>
                @endif
            </div>
        </div>
    
        <div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
            <label class="col-md-4 control-label">E-Mail Address</label>
            <div class="col-md-6">
                <input type="email" class="form-control" name="email" id="email" value="{{ old('email') }}">
                @if ($errors->has('email'))
                   <span class="help-block"><strong>{{ $errors->first('email') }}</strong></span>
                @endif
            </div>
        </div>
    
        <div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
            <label class="col-md-4 control-label">Password</label>
            <div class="col-md-6">
                <input type="password" class="form-control" name="password" id="password">
                @if ($errors->has('password'))
                    <span class="help-block"><strong>{{ $errors->first('password') }}</strong></span>
                @endif
            </div>
        </div>
    
        <div class="form-group{{ $errors->has('password_confirmation') ? ' has-error' : '' }}">
            <label class="col-md-4 control-label">Confirm Password</label>
            <div class="col-md-6">
                <input type="password" class="form-control" name="password_confirmation" id="password_confirmation">
                @if ($errors->has('password_confirmation'))
                    <span class="help-block"><strong>{{ $errors->first('password_confirmation') }}</strong></span>
                @endif
            </div>
        </div>
        <div class="form-group">
            <div class="col-md-6 col-md-offset-4">
                <button type="submit" class="btn btn-primary">
                    <i class="fa fa-btn fa-user"></i>Register
                </button>
            </div>
        </div>
    </form>

javascript:

<script>
    $(function () {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $("#register").validate({
            rules: {
                name: {
                    required: true,
                    rangelength: [4, 30],
                    remote: {
                        url: "{{url('services/validation/verify_name')}}",
                        type: "post"
                    }
                },
                email: {
                    required: true,
                    email: true,
                    minlength: 9,
                    maxlength: 30,
                    remote: {
                        url: "{{url('services/validation/verify_email')}}",
                        type: "post"
                    }
                },
                password: {
                    required: true,
                    rangelength: [6, 20]
                },
                "password_confirmation": {
                    equalTo: "#password"
                }
            },
            messages: {
                name: {
                    required: "用户名不能为空",
                    rangelength: "用户名在4-30个字符之间",
                    remote: "该用户名已被注册,请更换"
                },
                email: {
                    required: "Email不能为空",
                    minlength: "Email最少9个字符",
                    maxlength: "Email最多30个字符",
                    email: "Email格式不正确",
                    remote: "此Email已存在,请更换"
                },
                password: {
                    required: "密码不能为空",
                    rangelength: "密码在6-20个字符之间"
                },
                "password_confirmation": {
                    equalTo: "两次输入的密码不一致"
                }
            },
            errorClass: "has-danger",

            success: function (label, elem) {
                var element = $(elem);
                if (element.is('input[name="name"]')) {
                    label.html("恭喜,该用户名可以用");
                } else if (element.is('input[name="email"]')) {
                    label.html("恭喜,该邮箱可以用");
                }
            },

            highlight: function (element, errorClass) {
                $(element).fadeOut(function () {
                    $(element).fadeIn();
                });
                $(element).closest(".form-group").addClass(errorClass);
            },
            unhighlight: function (element, errorClass) {
                $(element).closest(".form-group").removeClass(errorClass);
            },
            errorPlacement: function (error, element) {
                error.insertAfter(element);
            }
        });
    });
</script>

如果把远程验证去掉,是可以提交的,加上远程验证后,点击提交,貌似第一个远程验证信息会获得焦点,表单不能提交,需要怎么改一下呢?


validator.js


我知道了,url写错了

url: "{{url('services/validation/verify_name')}}",
url: "{{url('services/validation/verify_email')}}",

应该是:

url: "services/validation/verify_name",
url: "services/validation/verify_email",
【热门文章】
【热门文章】