Validar formulario con javascript

Código Javascript

El siguiente código de javascript permite validar el texto que se ingresa en una caja de texto de un formulario. Existen diversas validaciones con javascript como valdiar que solo sea posible escribir números, letras, números y letras, o determinados caracteres...

Un ejemplo básico de validación de formulario con javascript se muestra a continuación:




    <html>

<head>

<title></ title>

<script type="text/javascript">

function validar(e) { // 1

    tecla = (document.all) ? e.keyCode : e.which; // 2

    if (tecla==8) return true; // 3

    patron =/[A-Za-z\s]/; // 4

    te = String.fromCharCode(tecla); // 5

    return patron.test(te); // 6

} 

</script>

</ head>



< body>

<input type="text" name="textfield" onkeypress="return validar(event)" /><br />

<input type="text" name="textfield" id="textfield" onkeypress="return validar(event)"/>

</body>

</html>

  

A continuación la explicación de las líneas de código que aparecen numeradas:

1- A la función se le pasa el objeto event

2- Aquí hay que distinguir si el navegador es Internet Explorer (IE) document.all u otro, porque ya os habreis dado cuenta que no todos los navegadores son iguales. Si el navegador es IE se asigna a la variable tecla el valor de e.keyCode, en caso contrario se asigna el valor de e.which. En los dos casos se obtiene el valor ASCII de la tecla pulsada.

3- En esta línea se comprueba si es la tecla pulsada es la tecla de retroceso y en ese caso la función termina (retorna). De esta forma se permite borrar caracteres.

4- Aquí se pone la expresión regular que permite validar si se admite o no la pulsación. En el ejemplo se admiten letras mayúsculas A-Z, letras minúsculas a-z y el espacio \s

5- Se pasa el valor ASCII de la variable tecla a su carácter correspondiente

6- Si el carácter coincide con el patrón, la función devuelve true, si no coincide devuelve false.

Ahora vamos a ver varias expresiones regulares para distintas validaciones. Sustituye la línea 4 por la que necesites:


patron = /\d/; // Solo acepta números

patron = /\w/; // Acepta números y letras

patron = /\D/; // No acepta números

patron =/[A-Za-zñÑ\s]/; // igual que el ejemplo, pero acepta también las letras ñ y Ñ

También se puede hacer un patrón que acepte determinados caracteres, poniéndolos entre corchetes. Veamos un ejemplo para validar que solo se acepte a, j, t, 6 y 9:


   patron = /[ajt69]/;

O el caso contrario, queremos aceptar cualquier caracter, menos alguno. Los que no nos sirven se ponen en el patron y se cambia un poco el código de la función que usamos para validar


patron =/[javierb]/; // 4
te = String.fromCharCode(tecla); // 5
return !patron.test(te); // 6

tags: