Archive for March 12th, 2009

Validación de campos utilizando patrones javascript

Thursday, March 12th, 2009

Una de las cosas más importantes que debe cuidar todo buen desarrollador, es vigilar los más posible, la calidad de los datos que se incluyen en un sistema. Bajo este precepto, es importante el realizar tareas de verificación de datos antes de que estos sean guardados en las tablas.

Por este motivo, en esta ocasión quisiera presentarles el uso de patrones de expresiones regulares javascript, para realizar algunas de estas tareas de verificación.

Un patrón o expresión regular es, básicamente, una cadena de caracteres simples y especiales que utilizamos para definir el contenido de una constante o una variable, y por ende, de un campo de datos.

Para aquellos de ustedes que deseen aprender más acerca de los patrones o expresiones regulares, los invito a realizar una búsqueda en Internet, donde pueden encontrar muy buen material al respecto.

Para utilizar estos patrones o expresiones regulares para validar los datos ingresados en nuestras formas de Oracle Apex, el procedimiento es el siguiente:

  1. Ingrese a la página de propiedades del campo al que desee agregar la validación.
  2. Dirijase a la sección Elemento.
  3. Patrones javascript 1

  4. En el campo Atributos de Elemento de Pantalla HTML ingrese el siguiente código: onChange=”javascript:patronRe = /patron/;if (!patronRe.test(this.value)) {alert(‘Mensaje de error’);} else {html_GetElement(‘P99_SIGUIENTE’).focus();}”
  5. Haga clic en el botón Aplicar cambios

El resultado de un dato erróneamente introducido sería algo similar a lo que se muestra en la siguiente ilustración.

Patrones javascript 2

Algunas consideraciones a tomar en cuenta:

  • Reemplace en el código de arriba, la cadena “patron”, por el patrón correspondiente al dato a verificar.
  • Reemplace “Mensaje de error”, por el mensaje que desea que aparezca mostrado en la ventana de alerta, cuando el dato ingresado no se adecúa al patrón proporcionado.
  • La cadena del patrón debe ser ingresada consecutivamente, no debe incluir saltos de línea, pues esto provocaría un error en la función de validación.

Finalmente, les dejo tres ejemplos de patrones muy útiles y que pueden utilizar en sus formas.

  • Patrón para permitir solo el ingreso de letras (mayúsculas y minúsculas) y espacios en blanco, para una cadena que debe tener al menos 10 caracteres de largo.
  • /[a-zA-Z\s]{10,}/

  • Patrón para verificar un número telefónico, el cual debe inicial con un 2 o un 8 y que debe incluir don grupos de números de 4 dígitos cada uno, separados por un espacio en blanco o un guión.
  • /^(2|8)\d{3}(-| )\d{4}/

  • Patrón para verificar una dirección de correo electrónico. Verifica que los dominios esten contenidos en uno de los siguientes: com, net, org, edu, int, mil, gov, arpa, biz, aero, name, coop, info, pro, museum
  • /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*\.(\w{2}|(com|net|org|edu|int|mil|gov|arpa|biz|aero|name|coop|info|pro|museum))$/

    Solo me resta invitarlos a ver un ejemplo implementado en mi espacio de trabajo en OTN.

    Recordarles que pueden dejar comentarios, sugerencias o solicitudes cuando lo deseen.