jQuery:使用`jquery-validation`的远程验证后无法提交表单

时间:2016-05-14 18:03:09

标签: javascript jquery forms validation

我正在使用“jquery-validation”https://github.com/jzaefferer/jquery-validation来验证我的表单,

有一个问题,那就是:

使用jquery-validation的远程验证后,无法提交

表单。如果删除了远程方法,则没问题。

我该怎么办?先谢谢。

查看:

<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"
                }
            },
            errorClass: "has-danger",

            success: function (label, elem) {
                var element = $(elem);
                if (element.is('input[name="name"]')) {
                    label.html("available");
                } else if (element.is('input[name="email"]')) {
                    label.html("available");
                }
            },

            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>

1 个答案:

答案 0 :(得分:0)

我应该修改网址:

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

他们应该是:

url: "services/validation/verify_name",
url: "services/validation/verify_email",