What happens is the following I have a registration form and what I want is that what is recorded comes out a sweetAlert . The problem is that pressing the button leaves the alert so the form is not validated. I would like to know how I do so that the alert is only shown if the form is completely validated. Use formValidation.io to validate my form. I leave the validation code:
$().ready(function () {
$('#formularioRegistro').formValidation({// Validación datos capa cliente. TENER PRESENTE EL ID DEL FORM
err: {container: 'tooltip'}, //muestra en tooltips
icon: {valid: 'fa fa-thumbs-up', invalid: 'fa fa-thumbs-down', validating: 'fa fa-refresh'}, //iconos
//locale: 'es_ES', //idioma - debe enlazar el archivo "es_ES.js"
fields: {
nombre: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Ingrese un nombre válido '
},
regexp: {
regexp: /^[a-zA-ZñÑáéíóúÁÉÍÓÚ/\s/a-zA-ZñÑáéíóúÁÉÍÓÚ]+$/,
message: 'Solo letras, sin números o carácteres especiales'
},
stringLength: {
min: 3,
message: 'Mínimo 3 carácteres'
}
}
},
apellido: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Ingrese un apellido válido'
},
regexp: {
regexp: /^[a-zA-ZñÑáéíóúÁÉÍÓÚ/\s/a-zA-ZñÑáéíóúÁÉÍÓÚ]+$/,
message: 'Solo letras, sin números o carácteres especiales'
},
stringLength: {
min: 3,
message: 'Mínimo 3 carácteres'
}
}
},
documento: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Ingrese un documento válido'
},
regexp: {
regexp: /^[0-9]+$/,
message: 'Solo números'
},
stringLength: {
min: 5,
message: 'Mínimo 5 carácteres'
}
}
},
correo: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Ingrese un correo válido'
},
regexp: {
regexp: /^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/,
message: 'No se aceptan carácteres especiales'
},
stringLength: {
min: 5,
message: 'Mínimo 5 carácteres'
}
}
},
contrasena: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Ingrese una contraseña válida'
},
regexp: {
regexp: /^[a-zA-ZñÑáéíóúÁÉÍÓÚ0-9]+$/,
message: 'No se aceptan carácteres especiales'
},
stringLength: {
min: 5,
message: 'Minimo 5 carácteres'
}
}
},
repetirContraseña: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Las contraseñas no coinciden'
},
regexp: {
regexp: /^[a-zA-ZñÑáéíóúÁÉÍÓÚ0-9]+$/,
message: 'No se aceptan carácteres especiales'
},
stringLength: {
min: 5,
message: 'Minimo 5 carácteres'
},
identical: {
field: 'contraseña',
message: 'Las contraseñas no coinciden'
}
}
},
direccion: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Ingrese una dirección válida'
},
regexp: {
regexp: /^[a-zA-ZñÑáéíóúÁÉÍÓÚ0-9/\s/a-zA-ZñÑáéíóúÁÉÍÓÚ]+$/,
message: 'No se aceptan carácteres especiales'
},
stringLength: {
min: 10,
message: 'Mínimo 10 carácteres'
}
}
},
tel: {//Validar con los aributos NAME de cada INPUT
row: '.form-group',
validators: {
notEmpty: {
message: 'Ingrese un télefono válido'
},
regexp: {
regexp: /^[0-9-]+$/,
message: 'Sólo numeros'
},
stringLength: {
min: 7,
message: 'Mínimo 7 carácteres'
}
}
},
ciudad: {
validators: {
callback: {
message: 'Debe elegir su ciudad',
callback: function (value, validator, $field) {
// Get the selected options
var options = validator.getFieldElements('ciudad').val();
return (options !== null && options.length >= 1 && options.length <= 4);
}
}
}
},
genero: {
validators: {
callback: {
message: 'Debe elegir su género',
callback: function (value, validator, $field) {
// Get the selected options
var options = validator.getFieldElements('genero').val();
return (options !== null && options.length >= 1 && options.length <= 10);
}
}
}
},
'confirmar[]': {
row: '.form-group',
validators: {
notEmpty: {
message: 'Debe aceptar términos y condiciones'
},
stringLength: {
max: 1,
message: 'Debe aceptar términos y condiciones'
}
}
}
}
});
});
I know there is an event called success.form.fv but I do not know how to implement the sweetAlert alert that I want it to come out:
swal ("Registered correctly!", "Thanks for signing up!", "success")
Thanks for helping me.