validació de formularis amb HTML5
HTML4 permetia escriure formularis, però alhora de validar els camps tot era força complicat. O s’havia d’escriure força Javascript per validar els camps abans que el formulari s’enviés al servidor o bé s’havia de validar tot al servidor. En general és bo validar tant en client i en servidor, ja que si no es valida en client, aleshores es tindran moltes més peticions al servidor i l’usuari notarà que el programa va lent; i si no es valida en servidor no hi ha garanties que un hacker no hagi manipulat la petició. Per validar en client el meu consell és utilitzar jQuery + jQuery Validation Engine, per la banda del servidor aleshores dependrà de la tecnologia que s’utilitzi a la banda servidor ( Struts, JSF, Spring, .NET, php, … ).
En HTML5 però la cosa ha canviat. HTML5 intenta facilitar la vida als programadors afegint validadors al llenguatge HTML.
Per exemple per fer obligatori un camp es pot posar required: <input type="text" name="name" required>
Per exemple validar un email es pot posar type=”email”: <input type="email" name="myEmail">
Fins i tot es pot indicar una expressió regular pattern=…: <input type="url" name="website" pattern="https?://.+">
Els nous tipus de input són:
- url
- number
- range
- color
- date
- datetime
- datetime-local
- month
- search
- tel
- time
- week
La gran pega d’utilitzar la validació de formularis del HTML5 és la traducció dels missatges d’error. Els missatges sempre surten en l’idioma del navegador. O sigui que si utilitzes un navegador en castellà i en proves una pàgina web en català, els missatges d’error sortiran en castellà en comptes de català i clar això no queda gaire bé de cara l’usuari.
Si per qualsevol raó no vols utilitzar la validació dels formularis HTML5 aleshores cal posar <form novalidate> … </form>
Més informació:
