Validare un form con jQuery : tecniche, tutorial e potenzialità
Il discorso sulla validazione di un form é talmente ampio che, riassumerlo in un articolo non sarà facile. In ogni caso ci provo.
Parlare di HTML forms significa risalire quasi agli albori del web. Si tratta di una struttura di base in applicazioni web e non solo. Grazie al Javascript, gestire gli elementi di un form html non é nulla di complicato anche se lo scopo principale dovrebbe esser quello di aiutare l’utente nella compilazione.
Validare un form con jQuery : Introduzione
jQuery, ancor meglio del solo Javascript consente di manipolare in modo completo e anche accattivante tutti gli elementi di un form riuscendo a seguire i passi dell’utente, aiutarlo laddove serve, segnalare eventuali errori, controllare i campi riempiti ecc
Attenzione a non pensare che la validazione di un form lato client con jQuery (o semplice Javascript) sia sufficiente al fine di controllare i dati che possono esser inviati tramite form. Basta pensare che, disabilitando il js, un utente può inviare davvero ciò che vuole. Questo per sottolineare come il controllo vero e proprio sui dati e le informazioni inviate va fatto lato server (Java, Php o altro) prima di salvare dati nel database, insomma.
Accanto alla possibilità di selezionare qualsiasi elemento di un form, jQuery offre tutta una serie di opzioni che renderanno il codice snello e otterrete anche effetti particolari e di impatto per l’utente.
Basta pensare che il filtro :input , ad esempio, vi consente di selezionare tutti gli elementi di input di un form (textarea, bottoni, select box ecc) :
$(‘#myform:input’).css(‘background-color’ , ‘yellow’)
Il codice qui sopra consente di impostare a tutti gli elementi di input del nostro form uno sfondo di colore giallo.
Ma, logicamente, non é tutto. Esistono molti altri filtri come :text, :password, :radio, :submit, :button ecc oppure alcuni specifici per selezionare lo stato o il valore di alcuni elementi come :enabled, :disabled, :selected ecc
Questi filtri, combinati con altri metodi jQuery permettono davvero un controllo totale sui forms Html. Come sempre, esistono plugin jQuery specifici già pronti con tutta una serie di opzioni da sfruttare e, in tal caso, il più famoso e completo é senza dubbio Validation Plugin.
Penso di dedicare un articolo a parte alla validazione di un form html con questo plugin e, quindi, ora passo a presentarvi alcune tecniche e tutorial sulla validazione molto interessanti e utili
Validare un form con jQuery : Tecniche e Tutorials
Form Validation with jQuery from Scratch
In questo articolo vi verrà mostrato come costruire un semplice, ma potente ed estensibile, sistema di validazione dei form con jQuery.
Nessun riferimento a plugin specifici, ma una miniguida per costruiree realizzare una soluzione leggera e flessibile da zero.
-
-> Tutorial & Demo
Come convalidare Form con PHP e jQuery
Con questo tutorial apprenderete a convalidare i moduli utilizzando PHP e jQuery e pertanto saranno coinvolti sia il lato client (javascript usando jQuery) sia il lato server (PHP).
Alla fine del tutorial, potrete ottenere un esempio davvero molto completo.
-
-> Tutorial & Demo
Validazione di form commenti per WordPress utilizzando jQuery
Entriamo nel vivo del blogging e presentiamo una guida step by step che vi aiuta a costruire un valido e robusto sistema di validazione jQuery per i campi presenti nella gestione dei commenti su WordPress.
Form Validation utilizzando jQuery
Questo articolo discute, invece, la convalida lato client di un form html utilizzando proprio il Validation plugin di jQuery. Il mini-tutorial parte da un esempio reale con un form che contiene quattro campi: nome, e-mail, commenti e URL. I primi tre campi sono obbligatori, mentre il campo URL è opzionale. Molto interessante e utile.
-
-> Tutorial & Demo
Utilizzare Ajax e jQuery per convalidare Form
Questo tutorial presenta la validazione di un form utilizzando Ajax e jQuery.