Why “formvalidation plugin” throws me a bug in remote validation?

问题

Why "formvalidation plugin" throws me a bug in remote validation?

Use formvalidation 0.8.1, bootstrap 3 and laravel 5.3.

When I make use of "remote" validation it sends me the following error:

FormValidation.min.js: 4 Uncaught TypeError: b.success is not a function
     At f (http: // localhost: 8000 / formValidation / formValidation.min.js: 4: 6021)
     At Object.validate (http: // localhost: 8000 / formValidation / formValidation.min.js: 4: 6890)
     At FormValidation.Framework.Bootstrap.validateField (http: // localhost: 8000 / formValidation / formValidation.min.js: 1: 27660)
     At HTMLInputElement.  (http: // localhost: 8000 / formValidation / formValidation.min.js: 1: 11025)
     At HTMLInputElement.  (http: // localhost: 8000 / formValidation / formValidation.min.js: 1: 22338)
     At HTMLInputElement.dispatch (http: // localhost: 8000 / js / jquery.min.js: 3: 10315)
     At HTMLInputElement.q.handle (http: // localhost: 8000 / js / jquery.min.js: 3: 8342)

Why?

View:

                    <div id="ModalCrear" class="modal fade" role="dialog"> 
                    <div class="modal-dialog">
                        <div class="modal-content"> 
                                <div class="modal-header">
                                    <h4 class="modal-tittle">Crear</h4>
                                </div>
                                <form class="form-horizontal" role="form" id="form-crear">
                                    <div class="modal-body">
                                            <div class="form-group">
                                                <label for="CrearNombre" class="control-label col-sm-2">Nombre: </label>
                                                <div class="col-sm-10">
                                                    <input type="text" class="form-control" id="CrearNombre" name="CrearNombre">
                                                </div>
                                            </div>
                                    </div>

                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-default" data-dismiss="modal">
                                            <span class="glyphicon glyphicon-remove"></span> Cerrar 
                                        </button>
                                        <button type="button" id="Guardar" class="btn btn-primary" disabled="disabled">
                                            <span class="fa fa-save"> Guardar</span>
                                        </button>
                                    </div>
                                </form>
                        </div>
                    </div>
                </div>

jQuery:

$('#form-crear').formValidation({
            framework: 'bootstrap',
            icon: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                CrearNombre: {
                    validators: {
                        notEmpty: {
                            message: 'El campo Nombre es requerido'
                        },
                        stringLength: {
                            min: 5,
                            max: 30,
                            message: 'El Nombre de 5 a 30 caracteres de largo'
                        },
                        regexp: {
                            regexp: /^[a-zA-Z]+$/,
                            message: 'El Nombre solo puede contener letras'
                        },
                        remote: {
                            message: 'El Cargo ya esta registrado',
                            url: "cargos/comprobacion",  
                            type: "post",
                            async: true
                        }
                    }
                }
            }
        });

Controller:

                $isAvailable = true;
            if (Cargos::where('nombre', 'ilike', $req->get('CrearNombre'))->exists()) {
                $isAvailable = true;
            } else {
                $isAvailable = false;
            }
            return \Response::json(array('valid' => $isAvailable));

回答1:

Uncaught TypeError: b.success is not a function

I debug the js code and find b object is jqXHR. Since JQuery 3.0, there is no success function.

The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead. from jquery.ajax

There are two solutions:

use older version jQuery ( < 3.0)
modify formvalidation code, replace success with done, error with fail

来源：https://stackoverflow.com/questions/40823662/why-formvalidation-plugin-throws-me-a-bug-in-remote-validation

标签

javascript

jquery

twitter-bootstrap

formvalidation-plugin