Validate Form V2
Allora, ho fatto attendere anche troppo questa nuova versione di validate form. La nuova versione “dovrebbe” funzionare con tutti i browser e richiede mooTools 1.11.
Lo script è leggermente diverso dal precedente. Per prima cosa richiede che il form abbia la classe “validate-form”. Comunque la classe può essere cambiata dalla riga del js:
var validate_class_c="validate-form";
Come nel vecchio, anche qui si basa su un campo nascosto di nome “required” con un value contenente gli id dei campi da controllare del tipo:
<input type="hidden" name="required" value="nome,cognome" />
In questo modo verranno controllati gli input con gli id “nome” e “cognome”.
In caso siano di value vuoto lo script inserirà a un nuovo campo di tipo span con una particolare classe.
La struttura tipo degli input dovrà essere questa:
<p>
<label for="surname">surname</label>
<input type="text" name="surname" id="surname" />
</p>
Naturalmente la struttura può variare, ma l'importante e che ci sia un contenitore attorno all'input.
Lo script funziona con gli input, select, textarea, radiobutton e checkbox.
Per farlo funzionare al meglio si può usare queste righe di css:
form.validate-form p{position:relative;}
form.validate-form .required-input{ position:absolute; top:9px;
right:5px; background: transparent url(img/alert-form.gif);
width:16px; height:16px; display:block;}
form.validate-form .required-input em{ display:none;}
L'immagine alert-form.gif si trova nel pacchetto zip che troverete più giù.
mooTools components required
Core
- Core.js
Class
- Class.js
Native
- Array.js
- String.js
- Function.js
- Number.js
- Element.js
Element
- Element.Filters.js
- Element.Selectors.js
Credo di avervi detto tutto, comunque per qualunque cosa, lasciate pure un commento qui sotto.
Di seguito trovere il pacchetto zip con il file e un demo per utilizzarlo.
Scarica validate form v2