El día hablaremos de como poder validar un formulario de HTML, como por ejemplo una página donde nos piden un registro para ingresar, todo esto en HTML ya que si lo hiciéramos con algún lenguaje de programación con C# o VB, lo podríamos realizar por medio de código.
Bien para ello recordemos que nuestro código de javascript, normalmente va dentro de <head></head> bueno para ello les dejo un código con el cual se puede realizar lo comentado con todo y mis comentarios.
<head>
<script type="text/javascript">
// JavaScript Document en este apartado especificamos que es un script dentro de nuestra pagina html y definimos de que tipo es
function valida() {
// declaramos el nombre de nuestra funcion y a su vez declaramos una variable que funcionara como bandera para determinar si es verdadero o falso.
var banOK = true;
//recordando que con document.getElementById("idcontrol") buscamos dentro el formulario o pagina el control deseado y poder acceder asi a sus atributos que nos proporciona, recordando que idcontrol es el id de nuestro control
//validar la longitud del texto de un control text
if (document.getElementById("idcontrol").value.length < 1) {
banOK = false;
}
//validar si nuestro control text esta vacío
if (document.getElementById("idcontrol").value != "") {
banOK = false;
}
//validar que el texto de nuestro control sea de tipo numérico
if (isNaN(document.getElementById("idcontrol").value)) {
banOK = false;
}
//validar un control check box
if (document.getElementById("idcontrol").checked) {
banOK = false;
}
//validar si el texto de nuestro texto tiene formato de email con un expresión regular
var expresion = /^[0-9a-z_\-\.]+@[0-9a-z\-\.]+\.[a-z]{2,4}$/i;
if (!expresion.test(document.getElementById("idcontrol").value)) {
banOK = false;
}
//en todos los casos si entraba por las validaciones se cambia el valor de la bandera a false, esto quiere decir que la validación encontró algún dato mal.
if (!BanOK) {
//y por último, esto sería un plus mandar un mensaje de alerta donde si no pasaba la validación, se envía un mensaje
alert("Error en formulario");
}
return banOK;
//El return de nuestra función, cuando regresa un falso la página no realiza ningún cambio.
}
</script>
</head>
<body>
//dentro de form declaramos nuestra llamada por medio de onsubmit a nuestra función de javascript
<form id="form1" onsubmit="return validar();">
</form>
</body>
Espero les sea de utilidad este código, y si tienen dudas, no duden en comentarlo.....
Un saludo Cordial y que tengan un excelente inicio de semana....
Atte.
LSCA Gustavo Ortiz Gámez.
No hay comentarios:
Publicar un comentario