Junto con wForms vienen predefinidas las validaciones básicas: números, fechas, direcciones de email,… pero wForms también nos da la posibilidad de hacer validaciones personalizadas.
En nuestro ejemplo vamos a definir dos validaciones. La primera será la de un código postal. La validación comprobará que sea un dígito de 5 números. La segunda validación comprobará que el texto introducido sea M o F. Intentando representar el concepto de texto.
Para hacer las validaciones personalizadas con wForms utilizamos la clase validate-custom, la cual va seguida de una expresión regular.
Hay que recordar que la expresión regular va entre dos barras invertidas (/)
/expresión_regular/
No vamos a entrar en el detalle de como se conforman las expresiones regulares en JavaScript y las diferentes estructuras que se pueden conformar. Para nuestros ejemplos las expresiones regulares que utilizaremos serán las siguientes:
- Código Postal /d{2}/
- Sexo /m|f|M|F/
Es por ello que nuestras clases quedarán de la siguiente forma:
<input type="text" id="cp" class="validate-custom /\d{5}/"/>
<input type="text" id="sexo" class="validate-custom /m|f|M|F/"/>
Hay que acordarse de instanciar las librerías wForms al principio de la página:
<script type="text/javascript" src="wforms.js"></script>
