0

Les cuento: tengo un botón de un formulario que lo que hace es redirigir la pagina a otra web, una vez que se validan los datos. El href del boton tiene informacion solo si se validan esos datos, si no será href nulo.

El problema está en que, a pesar de que todo se ejecuta normalmente, para que el usuario pueda ser redirigido a la página hacen falta dos clicks en el boton, y no se por qué.

Les paso el formato del formulario html, la funcion que valida los datos y luego la parte donde se capturan los datos y es rellenado el href del boton. Todo esto de forma muy resumida con las cosas relevantes.

FORM HTML:

        <form id="formTarjeta" class="formPayu" onsubmit="return registroCompraTarjeta()">

            <p><strong>Dirección de envío</strong></p>

            <div class="form-group">

                <div class="input-group">

                    <span class="input-group-addon">

                        <i class="glyphicon glyphicon-home"></i>

                    </span>

                    <input type="text" class="form-control" id="registroDireccionTarjeta" name="registroDireccionTarjeta" placeholder="BUSQUE y SELECCIONE su dirección" required>

                </div>

            </div>

            <div class="clearfix"></div>

        <a type="submit" name="Submit" class="btn btn-block btn-lg btn-default backColor btnPayu" id="load" data-loading-text="<i class='fa fa-circle-o-notch fa-spin'></i> PROCESANDO">CONFIRMAR DATOS</a>

    </form>

FUNCION DE VALIDACION EN JS

    function registroCompraTarjeta(){

        /*=============================================
        VALIDAR DIRECCION
        =============================================*/

        var direccionTarjeta = $("#registroDireccionTarjeta").val();

        if(direccionTarjeta == ""){ 

            swal('ATENCIÓN', 'La dirección de envío es un campo obligatorio', 'warning');

            return false; }

      return true;

    }

CAPTURA DE DATOS Y CAMBIO HREF BOTON

$("#formTarjeta").on('click','.btnPayu',function(e){

    if (registroCompraTarjeta() == true) {

         //CAPTURO DATOS FORMULARIO Y CREO UN ARRAY PARA ENVIAR POR AJAX

        if(...){

            $.ajax({

                url:rutaOculta+"ajax/carrito.ajax.php",
                method:"POST",
                data: datos,
                cache: false,
                contentType: false,
                processData: false,
                success:function(respuesta){

                    $('.btnPayu').attr('href', respuesta);
                    $('.btnPayu').on('click', function() {
                        var $this = $(this);
                        $this.button('loading');
                        setTimeout(function() {
                           $this.button('reset');
                       }, 4000);
                    });

                }

            })

        } else {
                ... 
        }

    }

});
2
  • Buenas! Todo apunta que el problema que te da es con la respuesta de AJAX. De todas formas, podrias complementar tu codigo de la llamada AJAX, concretamente el if(...) i el else{...}. Gracias Commented el 28 feb. 2019 a las 14:37
  • @IvanIsayenko ya la pude resolver por suerte! Era una cuestion de que ajax se maneja de forma asincrona, y era mejor hacer un window.location Commented el 1 mar. 2019 a las 0:02

1 respuesta 1

0

Me respondo a mi mismo. El problema era que ajax se maneja de forma asíncrona, por lo cual la mejor solución es poner un window.location(respuesta); para que directamente redirija al hacer clic y no quede esperando el otro clic

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.