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 {
...
}
}
});
if(...)
i elelse{...}
. Gracias