|
Torniamo a fare degli esempi. Supponiamo di avere una
form, e consideriamo il vecchio problema di verificare che i contenuti siano
corretti. Prima del JavaScript, l’unico modo di controllare era quello di
inviare la form ad un programma apposito invocato tramite il protocollo CGI.
Naturalmente questa soluzione ha tutti gli svantaggi di richiedere più interazioni
con il server e di non essere particolarmente “interattiva” con l’utente,
che si accorge dell’errore solo dopo aver completato la form ed essersela
vista rimandare indietro. Col JavaScript si può ora effettuare una validazione
“in loco”, avvisando l’utente degli errori che commette mentre sta compilando
la form. In figura 4
c’è un esempio di form che raccoglie un ordine verificando che i campi
siano corretti. La verifica in questo caso è minima: si controlla soltanto
che tutti i campi siano stati riempiti e che l’indirizzo di posta elettronica
contenga il carattere ‘@’.
<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript">
<!-- function verifica(form) {
if (form.nome.value == "") {
alert("Occorre riempire il campo Nome:");
return false;
} else if (form.cognome.value== "") {
alert("Occorre riempire il campo Cognome:");
return false;
} else if (form.email.value == "") {
alert("Occorre riempire il campo E-mail:");
return false;
} else if(form.email.value.indexOf('@', 0)== -1) {
alert("L'indirizzo di e-mail non è valido.");
return false;
}
alert("Il modulo è stato accettato.");
return true;
}
// --> </SCRIPT>
</HEAD>
<BODY>
<H1 ALIGN=CENTER>Modulo con verifica</H1>
<FORM METHOD="POST" onSubmit="return verifica(this);"
ACTION="mailto:orders@internet.com">
<BR>Nome:<BR> <INPUT TYPE="TEXT" SIZE=40 NAME="nome"> <BR>
Cognome:<BR> <INPUT TYPE="TEXT" SIZE=40
NAME="cognome"> <BR>E-mail:<BR> <INPUT TYPE="TEXT"
SIZE=40 NAME="email"> <P> <INPUT TYPE="SUBMIT" VALUE="
Invia "> <INPUT TYPE="RESET" VALUE=" Cancella "> </BODY>
Figura 4
Il meccanismo su cui si basa questo script è quello di intercettare l’evento
di SUBMIT della form utilizzando il parametro “onSubmit”. Se il codice attivato
da questo parametro ritorna true l’azione specificata come ACTION della form
viene eseguita, altrimenti no. La verifica della form viene delegata alla
funzione verifica, che controlla i campi. Se trova qualcosa che non va, essa
fa apparire una dialog box che avvisa degli errori e ritorna false, altrimenti
la form è convalidata e la funzione ritorna true. In quest’ultimo caso viene
eseguita la ACTION, che consiste nell’invio di una mail. Per la verità ciò
che viene inviato è in un formato piuttosto criptico e andrebbe decodificato,
ma questa è un’altra storia.
|