Ejemplo. Validar datos con Javascript.
main.js
document.addEventListener("DOMContentLoaded", function(event) { console.log('Se ha ejecutado código JS'); const btnActivar = document.getElementById("btnActivar"); function activarEnvio(){ alert("Enviando los datos..."); } var tabla1Fila1 = false; var tabla1Fila2 = false; var tabla1Fila3 = false; var tabla2Fila1 = false; var tabla2Fila2 = false; var tabla2Fila3 = false; function validarFormulario(){ var nomProd1 = ""; var monto1 = ""; var numContrato1 = ""; if(nomProd1!=""){ if(nomProd1!=""&&monto1!=""&&numContrato1!=""){ document.getElementById("infoError1").style.display="none";tabla1Fila1=true; }else{ document.getElementById("prrfError1").style.color="red"; document.getElementById("prrfError1").innerText="Error: Debe completar todos los datos de la tabla 1 fila 1."; document.getElementById("infoError1").style.display="block"; } }else{ if(monto1!=""&&numContrato1!=""){ document.getElementById("prrfError1").style.color="red"; document.getElementById("prrfError1").innerText="Error: Debe completar todos los datos de la tabla 1 fila 1."; document.getElementById("infoError1").style.display="block"; }else{ document.getElementById("infoError1").style.display="none";tabla1Fila1=true; } } var nomProd2 = ""; var monto2 = ""; var numContrato2 = ""; if(nomProd2!=""){ if(nomProd2!=""&&monto2!=""&&numContrato2!=""){ document.getElementById("infoError2").style.display="none";tabla1Fila2=true; }else{ document.getElementById("prrfError2").style.color="red"; document.getElementById("prrfError2").innerText="Error: Debe completar todos los datos de la tabla 1 fila 2."; document.getElementById("infoError2").style.display="block"; } }else{ if(monto2!=""&&numContrato2!=""){ document.getElementById("prrfError2").style.color="red"; document.getElementById("prrfError2").innerText="Error: Debe completar todos los datos de la tabla1 fila 2."; document.getElementById("infoError2").style.display="block"; }else{ document.getElementById("infoError2").style.display="none";tabla1Fila2=true; } } var nomProd3 = ""; var monto3 = ""; var numContrato3 = ""; if(nomProd3!=""){ if(nomProd3!=""&&monto3!=""&&numContrato3!=""){ document.getElementById("infoError3").style.display="none";tabla1Fila3=true; }else{ document.getElementById("prrfError3").style.color="red"; document.getElementById("prrfError3").innerText="Error: Debe completar todos los datos de la tabla 1 fila 3."; document.getElementById("infoError3").style.display="block"; } }else{ if(monto3!=""&&numContrato3!=""){ document.getElementById("prrfError3").style.color="red"; document.getElementById("prrfError3").innerText="Error: Debe completar todos los datos de la tabla 1 fila 3."; document.getElementById("infoError3").style.display="block"; }else{ document.getElementById("infoError3").style.display="none";tabla1Fila3=true; } } var tv1 = "9"; var nb1 = "4"; var nt1 = "7"; var cp1 = "12"; var s1 = "1234"; var pt1 = "1200"; if(tv1!=""){ if(tv1!=""&&nb1!=""&&nt1!=""&&cp1!=""&&s1!=""&&pt1!=""){ document.getElementById("infoError4").style.display="none";tabla2Fila1=true; }else{ document.getElementById("prrfError4").style.color="red"; document.getElementById("prrfError4").innerText="Error: Debe completar todos los datos de la tabla 2 fila 1."; document.getElementById("infoError4").style.display="block"; } }else{ if(nb1!=""&&nt1!=""&&cp1!=""&&s1!=""&&pt1!=""){ document.getElementById("prrfError4").style.color="red"; document.getElementById("prrfError4").innerText="Error: Debe completar todos los datos de la tabla 2 fila 1."; document.getElementById("infoError4").style.display="block"; }else{ document.getElementById("infoError4").style.display="none";tabla2Fila1=true; } } var tv2 = "B"; var nb2 = "y"; var nt2 = "6"; var cp2 = "99"; var s2 = "1204"; var pt2 = "1900"; if(tv2!=""){ if(tv2!=""&&nb2!=""&&nt2!=""&&cp2!=""&&s2!=""&&pt2!=""){ document.getElementById("infoError5").style.display="none";tabla2Fila2=true; }else{ document.getElementById("prrfError5").style.color="red"; document.getElementById("prrfError5").innerText="Error: Debe completar todos los datos de la tabla 2 fila 2."; document.getElementById("infoError5").style.display="block"; } }else{ if(nb2!=""&&nt2!=""&&cp2!=""&&s2!=""&&pt2!=""){ document.getElementById("prrfError5").style.color="red"; document.getElementById("prrfError5").innerText="Error: Debe completar todos los datos de la tabla 2 fila 2."; document.getElementById("infoError5").style.display="block"; }else{ document.getElementById("infoError5").style.display="none";tabla2Fila2=true; } } var tv3 = "G"; var nb3 = "8"; var nt3 = "87"; var cp3 = "4"; var s3 = "8"; var pt3 = "88"; if(tv3!=""){ if(tv3!=""&&nb3!=""&&nt3!=""&&cp3!=""&&s3!=""&&pt3!=""){ document.getElementById("infoError6").style.display="none";tabla2Fila3=true; }else{ document.getElementById("prrfError6").style.color="red"; document.getElementById("prrfError6").innerText="Error: Debe completar todos los datos de la tabla 2 fila 3."; document.getElementById("infoError6").style.display="block"; } }else{ if(nb3!=""&&nt3!=""&&cp3!=""&&s3!=""&&pt3!=""){ document.getElementById("prrfError6").style.color="red"; document.getElementById("prrfError6").innerText="Error: Debe completar todos los datos de la tabla 2 fila 3."; document.getElementById("infoError6").style.display="block"; }else{ document.getElementById("infoError6").style.display="none";tabla2Fila3=true; } } } btnActivar.addEventListener("click", ()=>{ console.log("Verificar datos"); validarFormulario(); if(tabla1Fila1 && tabla1Fila2 && tabla1Fila3 && tabla2Fila1 && tabla2Fila2 && tabla2Fila3){ document.getElementById("infoFinal").style.display="block"; document.getElementById("prrfFinal").innerText="Ya no hay errores, listo para enviar datos."; document.getElementById("prrfFinal").style.color="blue"; activarEnvio(); }else{ document.getElementById("infoFinal").style.display="block"; document.getElementById("prrfFinal").innerText="Hay errores, corrigalos por favor"; document.getElementById("prrfFinal").style.color="red"; } }); });
index.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Ejemplos en JS</title> </head> <script type="text/javascript" src="main.js"> </script> <style type="text/css"> #infoError1{ display: none; } #prrfError1{ text-align: center; } #infoError2{ display: none; } #prrfError2{ text-align: center; } #infoError3{ display: none; } #prrfError3{ text-align: center; } #infoError4{ display: none; } #prrfError4{ text-align: center; } #infoError5{ display: none; } #prrfError5{ text-align: center; } #infoError6{ display: none; } #prrfError6{ text-align: center; } #infoFinal{ display: none; } #prrfFinal{ text-align: center; } </style> <body> <h1>Programando en JS</h1> <div id="infoError1"> <p id="prrfError1"></p> </div><br/> <div id="infoError2"> <p id="prrfError2"></p> </div><br/> <div id="infoError3"> <p id="prrfError3"></p> </div><br/> <div id="infoError4"> <p id="prrfError4"></p> </div><br/> <div id="infoError5"> <p id="prrfError5"></p> </div><br/> <div id="infoError6"> <p id="prrfError6"></p> </div> <br/> <div id="infoFinal"> <p id="prrfFinal"></p> </div> <div id="btnDiv"> <button id="btnActivar">Verfificar</button> </div> </body> <html>
Validar RFC:
<script> function rfcValido(rfc, aceptarGenerico = true) { const re = /^([A-ZÑ&]{3,4}) ?(?:- ?)?(\d{2}(?:0[1-9]|1[0-2])(?:0[1-9]|[12]\d|3[01])) ?(?:- ?)?([A-Z\d]{2})([A\d])$/; var validado = rfc.match(re); if (!validado) // Coincide con el formato general del regex? return false; // Separar el dígito verificador del resto del RFC const digitoVerificador = validado.pop(), rfcSinDigito = validado.slice(1).join(''), len = rfcSinDigito.length, // Obtener el digito esperado diccionario = "0123456789ABCDEFGHIJKLMN&OPQRSTUVWXYZ Ñ", indice = len + 1; var suma, digitoEsperado; if (len == 12) suma = 0 else suma = 481; // Ajuste para persona moral for (var i = 0; i < len; i++) suma += diccionario.indexOf(rfcSinDigito.charAt(i)) * (indice - i); digitoEsperado = 11 - suma % 11; if (digitoEsperado == 11) digitoEsperado = 0; else if (digitoEsperado == 10) digitoEsperado = "A"; // El dígito verificador coincide con el esperado? // o es un RFC Genérico (ventas a público general)? if ((digitoVerificador != digitoEsperado) && (!aceptarGenerico || rfcSinDigito + digitoVerificador != "XAXX010101000")) return false; else if (!aceptarGenerico && rfcSinDigito + digitoVerificador == "XEXX010101000") return false; return rfcSinDigito + digitoVerificador; } </script>
Validar RFC
function rfcValido(rfc) { var re = /^([ A-ZÑ&]?[A-ZÑ&]{3}) ?(?:- ?)?(\d{2}(?:0[1-9]|1[0-2])(?:0[1-9]|[12]\d|3[01])) ?(?:- ?)?([A-Z\d]{2})([A\d])$/, validado = rfc.match(re); if (!validado) //Coincide con el formato general? return false; //Separar el dígito verificador del resto del RFC var digitoVerificador = validado.pop(), rfcSinDigito = validado.slice(1).join('') //Obtener el digito esperado var diccionario = "0123456789ABCDEFGHIJKLMN&OPQRSTUVWXYZ Ñ", lngSuma = 0.0, digitoEsperado; if (rfcSinDigito.length == 11) rfc = " " + rfc; //Ajustar a 12 for(var i=0; i<13; i++) lngSuma = lngSuma + diccionario.indexOf(rfcSinDigito.charAt(i)) * (13 - i); digitoEsperado = 11 - lngSuma % 11; if (digitoEsperado == 11) digitoEsperado = 0; if (digitoEsperado == 10) digitoEsperado = "A"; //El dígito verificador coincide con el esperado? return digitoVerificador == digitoEsperado; }
No hay comentarios:
Publicar un comentario