Magento mette a disposizione una serie di controlli dei vari campi Form:
validate-select – Seleziona un valore dalla Lista
required-entry – Campo obbligatorio
validate-number – Inserisci un numero valido
validate-digits – Inserisci solo numeri, spazio e altri caratteri come i punti e le virgole esclusi
validate-alpha – Usa solo lettere (a-z or A-Z)
validate-code – Usa lettere (a-z), numeri (0-9) o underscore (_), il primo carattere deve essere una lettera
validate-alphanum – Usa solo lettere (a-z or A-Z) o numeri (0-9). Non sono ammessi spazi o altri caratteri
validate-street – Usa solo lettere (a-z or A-Z), numeri (0-9), spazi, o il carattere cancelletto #
validate-phoneStrict – Inserisci un numero di telefono validio. Per esempio (123) 456-7890 o 123-456-7890
validate-phoneLax – Inserisci un numero di telefono valido. Per esempio (123) 456-7890 o 123-456-7890
validate-fax – Inserisci un numero di Fax valido. Per esempio (123) 456-7890 o 123-456-7890
validate-date – Inserisci una data valida
validate-email – Inserisci un indirizzo email valido. Per esempio johndoe@domain.com
validate-emailSender – Usa solo lettere (a-z or A-Z), numeri (0-9) , underscore (_) o spazi
validate-password – Inserisci 6 o più caratteri. Gli spazi ad inizio e fine saranno ignorati
validate-admin-password – Inserisci 7 o più caratteri. La Password deve contenere sia numeri che lettere
validate-cpassword – Verifica che la Passwordi di controllo sia uguale
validate-url – Inserisci un valido URL. http:// è obbligatorio
validate-clean-url – Inserisci un valido URL. Per esempio http://www.example.com o www.example.com
validate-identifier – Inserisci un valido ID. Per esempio example-page, example-page.html o anotherlevel/example-page
validate-xml-identifier – Inserisci un valido ID XML. Per esempio something_1, block5, id-4
validate-ssn – Inserisci un valido SSN. Per esempio 123-45-6789
validate-zip – Inserisci un valido CAP. Per esempio 90602 o 90602-1234
validate-zip-international – Inserisci un valido CAP
validate-date-au – Formato data non corretto usa: dd/mm/yyyy. Per esempio 17/03/2006
validate-currency-dollar – Inserisci una valuta corretta. Per esempio $100.00
validate-one-required – Seleziona una delle opzioni
validate-one-required-by-name – Seleziona una delle opzioni
validate-not-negative-number – Inserisci un numero positivo
validate-state – Seleziona lo Stato/Provincia
validate-new-password – Inserisci 6 o più caratteri. Gli spazi iniziali e finali saranno ignorati
validate-greater-than-zero – Inserisci un numero maggiore di 0
validate-zero-or-greater – Inserisci un numero maggiore o uguale a 0
validate-cc-number – Inserisci un numero di Carta di Credito valido
validate-cc-type – Il numero di Carta di Credi con corrisponde con il Tipo di Carta
validate-cc-type-select – Il Tipo di Carta non corrsisponde con il numero di Carta di Credito
validate-cc-exp – Data scadenza non corretta
validate-cc-cvn – Numero di verifica non valido
validate-data – Usa solo lettere (a-z or A-Z), numeri (0-9) o underscore (_), il primo carattere deve essere una lettera
validate-css-length – Inserisci una lunghezza valida per i CSS. Per esempio 100px o 77pt o 20em o .5ex o 50%
validate-length – Lunghezza massima superata
Per utilizzare queste validazione basta inserire una classe CSS con la verifica che deve essere implementata, ad es:
<input type="text"
id="field_id"
name="field_name"
value="value"
class="required-entry validate-alphanum"
/>
Nell’esempio sopra, richiediamo che il campo field_name sia obbligatorio e che contenga solo lettere (a-z e A-Z) e numeri (0-9).
Se invece volessimo fare dei controlli più specifici, come ad esempio il controllo del codice fiscale, possiamo creare una nostra validazione da inserire in Magento e per poi essere riutilizzata in tutto il sito. Per farlo è sufficiente inserire poche codice di Javascript:
if(Validation) {
Validation.addAllThese([
[
'validate-tuocontrollo',
'Messaggio da visualizzare',
function(v,r){
return v.indexOf('RCC')==-1?false:true;
}
]
]);
}
Dove:
validate-tuocontrollo: è la classe CSS che va inserita nel tag input
Messaggio da visualizzare: E’ il messaggio che verrà visualizzato all’utente nel caso in cui il controllo fallisce
function (v,r)…: E’ il controllo Javascript che si occuperà di validare il campo, il parametro v è il valore del campo mentre il parametro r è l’oggetto HTML da validare, nel nostro caso il TAG input
Per estendere il nostro controllo al tag dell’esempio sopra basta inserire la classe validate-tuocontrollo
<input type="text"
id="field_id"
name="field_name"
value="value"
class="required-entry validate-alphanum validate-tuocontrollo"
/>
Il codice Javascript di cui sopra, puo’ essere inserito in:
– In un file JS apposito che dovrà essere incluso nella pagina contenente il campo da validare
– Direttamente nel blocco phtml che contiene il campo da validare.
Riferimenti in inglese:
http://fishpig.co.uk/magento-forms-prototype-javascript-validation/
http://blog.baobaz.com/en/blog/custom-javascript-form-validators