I moduli in Flash5

20 gennaio 2001

Soprattutto nei siti aziendali risulta utile e, in alcuni casi, necessario, inserire un modulo da compilare per l’invio di informazioni da parte dell’utente.

Le prossime pagine sono dedicate esclusivamente alla creazione dai più semplici ai più complessi form (moduli) per l’invio di dati. Spiegherò unicamente i moduli che permettono l’invio dei dati ad un programma lato-server esterno (CGI, PHP o ASP). Non spiegherò dunque, l’invio dei dati direttamente per email.

Un modulo così costruito:

Nome: Cognome:
Telefono: Email:
Utente: Password:

Informazioni:

 

è semplicissimo riprodurlo in Flash.

In questo caso il form punta ad un indirizzo sconosciuto “http://www.nomesito.com/cgi-bin/nomecgi.cgi” ed ovviamente deve essere modificato con quello corretto. Al suo interno sono presenti anche 2 campi nascosti. Ecco il codice HTML del modulo:

<form action=”http://www.nomesito.com/cgi-bin/nomecgi.cgi” method=”post”> <input type=”hidden” name=”mail” value=”info@nomesito.com”> <input type=”hidden” name=”soggetto” value=”Modulo utenti”> <div align=”center”>   <table cellpadding=”4″ cellspacing=”0″>     <tr>       <td>Nome:</td>       <td><input type=”text” name=”nome” size=”15″></td>       <td>Cognome:</td>       <td><input type=”text” name=”cognome” size=”15″></td>     </tr>     <tr>       <td>Telefono:</td>       <td><input type=”text” name=”tel” size=”15″></td>       <td>Email:</td>       <td><input type=”text” name=”email” size=”15″></td>     </tr>     <tr>       <td>Utente:</td>       <td><input type=”text” name=”utente” size=”15″></td>       <td>Password:</td>       <td><input type=”password” name=”password” size=”15″></td>     </tr>     <tr>       <td colspan=”4″>         <p align=”center”>Informazioni: <textarea rows=”4″ name=”info” cols=”40″></textarea>         <p align=”center”><input type=”submit” value=”Invia” name=”invia”>          <input type=”reset” value=”Reimposta” name=”reimposta”>       </td>     </tr> </table> </div> </form>

Quindi nel modulo sono presenti 2 campi nascosti mail e soggetto, 5 campi di testo nome, cognome, tel, email e utente, un campo password password ed infine un campo TextArea info.

Niente di più semplice!

Campi di testo

Per inserire dei normali campi di testo come nome, è necessario inserire un blocco di testo Input Text:

Campo input text

Assegnare il nome al campo e ripetere l’operazione per tutti i campi di testo presenti nel modulo.

Campi TextAreaI campi TextArea hanno la particolarità di poter essere compilati su più righe rispetto all’unica riga dei normali campi di testo. Per creare un campo di questo tipo in Flash, l’operazione è identica al campo di testo normale, con l’eccezione di dover selezionare la voce Multiline che si trova nella finestra Text Options:

Campo multiline

Attivando questa opzione, è possibile attivare anche Word wrap, che consente di andare a capo automaticamente con l’intera parola digitata se questa supera la lunghezza del campo:

Avrete sicuramente notato che per scrollare su e giù nel campo è necessario utilizzare il cursore di testo, no? Uhm… non è per niente funzionale… proviamo ad inserire uno scroll di testo, vediamo se migliora:

Decisamente meglio non dite? Per capire come funziona lo scroll di testo vi rimando alla guide di Flash-MX.it.

Campi nascosti

Per creare dei campi nascosti ci sono 2 metodi.

Il primo è quello di creare un normale campo di testo, scrivere al suo interno il valore assegnato, e posizionarlo lontano dall’area di lavoro in modo che non venga visualizzato durante la riproduzione del filmato. Con il secondo metodo invece, basta assegnare il valore ad una variabile con lo stesso nome del campo prima dell’invio dei dati e il gioco è fatto:

mail = “info@nomesito.com”; soggetto = “Modulo utente”;

Campi password

Inserire un normale campo di testo e attivare l’opzione Password:

Campo password

Creare il bottone “reimposta”

Per ricreare l’effetto di questo pulsante in Flash, occorre scrivere delle action al Release del bottone che azzerano i valori di tutti i campi di testo presenti nel modulo:

on (release) {   nome = “”;   cognome = “”;   tel = “”;   email = “”;   utente = “”;   password = “”;   info = “”; }

Creare il bottone “invia”

Dopo aver creato il bottone, assegnare questa action:  

on (release) {   getURL (“http://www.nomesito.com/cgi-bin/nomecgi.cgi”, vars=POST) }

Altre proprietà

Le altre proprietà selezionabili per un campo di testo sono:

Max Chars. limita la digitazione, all’interno del campo, a x caratteri (dove x è il valore inserito):

Finestra Max Chars

Embed Fonts specifica quali tipi di caratteri esportare con la casella di testo. Selezionando per esempio 123 sarà possibile visualizzare esclusivamente i caratteri numerici. È possibile comunque specificare singolarmente ogni carattere nella casella di testo predisposta.

Finestra Embed fonts

Risultato finale

Ed è anche più bello esteticamente!

Se vuoi aggiornamenti su I moduli in Flash5 inserisci la tua e-mail nel box qui sotto:
 
X
Se vuoi aggiornamenti su I moduli in Flash5

inserisci la tua e-mail nel box qui sotto:

Ho letto e acconsento l'informativa sulla privacy

Acconsento al trattamento di cui al punto 3 dell'informativa sulla privacy