Come iniziare
Il setup di yav è semplice e veloce. Ecco i passi da seguire:
1. (opzionale) Imposta i valori di configurazione nel file yav-config.js;
2. Includi i file javascript nella tua pagina:
<HEAD>
<SCRIPT src="tuoPath/yav.js"></SCRIPT>
<SCRIPT src="tuoPath/yav-config.js"></SCRIPT>
</HEAD>
3. (opzionale, da yav 2.0) Per abilitare le funzioni avanzate aggiungi un evento onload alla tua pagina, qualcosa del tipo:
<body onload="yav.init('formName', rules);" >
4. Aggiungi le regole di validazione per ciascun campo che vuoi validare.
Devi semplicemete creare un array con la lista di regole, qualcosa del tipo:
<SCRIPT>
var rules=new Array();
rules[0]='username|required';
rules[1]='password|minlength|8';
... and so forth ...
</SCRIPT>
5. Aggiungi la chiamata alla funzione yav.performCheck(formName, rules, alertType) nel tuo form.
Questa funzione restituisce true se la validazione ha successo, false altrimenti. Puoi usarla come meglio preferisci in funzione delle tue necessità, ad esempio:
<form onsubmit="return performCheck('formName', rules, 'classic');">
La funzione accetta i seguenti parametri:
- formName: nome del form che devi validare;
- rules: array di regole rispetto a cui vuoi validare;
- alertType: tipo di notifica.
alertType accetta i seguenti valori:
- classic: mostra i messaggi di errore in un alert javascript;
- innerHtml: mostra i messaggi di errore incorporati all'interno della pagina;
- inline: mostra i messaggi di errore vicino al campo non validato (quando possibile);
- jsVar: imposta la variabile jsErrors con l'array dei messaggi di errore (undefined se la validazione ha successo).
Per i tipi
innerHtml,
inline e
jsVar devi creare un elemento DIV nella tua pagina con id uguale al valore della variabile
errorsdiv impostata nel file
yav-config.js,
qualcosa del tipo:
<DIV id=errorsDiv></DIV>
Per il tipo
inline devi creare un elemento SPAN per ciascun campo, con id uguale al valore della variabile
errorsdiv impostata nel file
yav-config.js,
concatenata con il nome del campo; qualcosa del tipo:
<span id=errorsDiv_fieldName></span>