es mi primera ves haciendo validaciones en JAVASCRIPT, y me gustaría poder realizar una validación para agregar un correo electrónico valido, y que no solo pongan por ejemplo "juan" sino que verifique el "@correo.com" si hubiera una opción de poder poner gmail, hotmail, y todos los correos validos estaría súper padre, pero por el momento me gustaría si me pudieran apoyar.
De igual modo para poder validar que se coloque de forma el CURP solo si son ciudadanos mexicanos, de lo contrario que deje el campo vacio.
Anexo mi código en javascript..
$(document).ready(() => {
const serializeForm = () => {
const dataArray = $('#form-captura-de-datos').serializeArray();
const output = {};
dataArray.forEach((field) => {
output[field.name] = field.value;
});
return output;
};
$('#form-captura-de-datos').on('submit', function(e) {
// Paramos el comportamiento del formulario
e.preventDefault();
// Validaciones
const { nombre, apellido, email, curp } = serializeForm();
var expRegEmail = /^(([^<>()[\]\\.,;:\s@"\']+(\.[^<>()[\]\\.,;:\s@"\']+)*)|("[^"\']+"))@((\[\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}\])|(([a-zA-Z\d\-]+\.)+[a-zA-Z]{2,}))$/;
var expRegCurp = /^[A-Z][AEIOUX][A-Z]{2}[0-9]{2}[0-1][0-9][0-3][0-9][MH][A-Z][BCDFGHJKLMNÑPQRSTVWXYZ]{4}[0-9A-Z][0-9]\z$/;
let errores = '';
let nombre = $('#nombre').val().trim();
if (nombre == '' || nombre.length >= 30) {
//if (nombre === '' || nombre.length >= 30) {
errores += '<p>El nombre no debe quedar vacío ni tener más de 30 caracteres.</p>';
$('#nombre').css('border-bottom-color', '#F14B4B');
} else {
$('#nombre').css('border-bottom-color', '#d1d1d1');
}
// Validado Apellido ==============================
//if ($('#apellido').val() == '' || $('#apellido').val() >= 30) {
let apellido = $('#apellido').val().trim();
if (apellido == '' || apellido.length >= 30) {
errores += '<p>El apellido no debe quedar vacío ni tener más de 30 caracteres.</p>'
$('#apellido').css('border-bottom-color', '#F14B4B');
} else {
$('#apellido').css('border-bottom-color', '#d1d1d1');
}
// Validado Correo ==============================
var esValido = expRegEmail.test($('#email'));
let email = $('#email').val().trim();
if (email == '' || email.length >= 30 || esValido) {
errores += '<p>Ingresa una cuenta de correo electrónico válida.</p>';
$('#email').css('border-bottom-color', '#F14B4B');
} else {
$('#email').css('border-bottom-color', '#d1d1d1');
}
//Validando curp=====================================
var esValido = expRegCurp.test($('#email'));
let curp = $('#curp').val().trim();
if (curp.length >= 18 || esValido) {
errores += '<p>Ingresa un CURP válido o deja en blanco si no eres mexicano.</p>';
$('#email').css('border-bottom-color', '#F14B4B');
} else {
$('#email').css('border-bottom-color', '#d1d1d1');
}
// ENVIANDO MENSAJE ============================
if (errores) {
const mensajeModal =
'<div class="modal_wrap">' +
'<div class="mensaje_modal">' +
'<h3>Errores encontrados</h3>' +
errores +
'<span id="btnClose">Cerrar</span>' +
'</div>' +
'</div>';
$('body').append(mensajeModal);
// CERRANDO MODAL ==============================
$('#btnClose').click(function() {
$('.modal_wrap').remove();
});
} else {
// Continuamos con la petición
e.currentTarget.submit();
}
});
});
<input type="email" required>