Vai a: [ Contenuti ] [ Categorie ] [ Cerca ]

Elucubrato da saibal

Addì 21 Dicembre 2001

Il modulo "suggerisci il sito ad un amico"

Il modulo “suggerisci il sito ad un amico”


Adesso aggiungo:

1

document.forms[0].elements[2].value = " Ciao amico/a, " + mittente + " pensa che questo sito ti potrebbe interessare " + link;

"Leggiamo" ancora una volta ed ottieniamo: "Il valore del terzo elemento del form (il campo hidden) avrà come valore la stringa "Ciao amico/a etc etc".
A questo punto fermiamoci un attimo per fare due calcoli e capire cosa riceveremo nella casella di posta.
Il form è composto da:

  • due campi di testo visibili: uno per il nome del mittente e l'altro per l'email del destinatario
  • una textarea per i commenti
  • un campo hidden
  • un bottone submit
  • un bottone reset

Guardando il codice html del form notiamo che solamente la textarea ha l'attributo name e quindi, da quanto detto finora, teoricamente dovremmo ricevere nell'email solo ciò che è stato scritto nella textarea stessa. Dobbiamo invece ricordarci che, attraverso javascript, attribuiamo un nome ed un valore anche al campo hidden e perciò riceveremo un'email fatta così:

1
2

Messaggio inviato a xxx@xxx.it = Ciao amico/a, saibal pensa che questo sito ti potrebbe interessare http://www.html.it
Commenti = Un bel sito!! Soprattutto il forum!!

Ecco quindi che, da un form con 6 elementi (3 campi text, una textarea e due bottoni), abbiamo un'email con solo due elementi stampati (quelli che ci interessano di più): il campo hidden e il campo commento.

Il form di prova analizzato è funzionante ma un minimo di controllo si rende necessario per evitare che, accidentalmente o meno, vengano inviati dei moduli vuoti. Ancora una volta ricorriamo a javascript per "obbligare" l'utente a riempire i campi Mittente ed Email destinatario:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114

<HTML> 
<HEAD> 
 
<TITLE>Segnala sito</TITLE> 
<SCRIPT language="Javascript">
<!--
/*
saibal copyright - 2001 - http://www.lorenzone.it
*/ 
 
var emailAddress="";
function destin() {
var link = "http://www.html.it"; // sito da suggerire
 
var messaggio_iniziale = "Messaggio inviato a " + emailAddress; // messaggio iniziale dell&#039;email
 
var mittente = document.forms[0].elements[0].value;
var destinatario=document.forms[0].elements[1].value; 
document.forms[0].elements[2].name = messaggio_iniziale; 
 
funz_destinatario = "mailto:" + destinatario + "?subject=Sito da visitare!!"; // soggetto dell&#039;email
 
document.forms[0].action = funz_destinatario; 
document.forms[0].elements[2].value = " Ciao amico/a, " + mittente + " pensa che questo sito ti potrebbe interessare " + link; // testo che segue il messaggio iniziale
} 
 
// funzione submit che segue al controllo della funzione nome ed email
function submitForm() { 
if ( (nome() ) && (email()) ) 
if (confirm("
Il form sarà spedito a :
 
"+emailAddress+"
 
Confermi l&#039;invio?")) 
return true; 
else 
alert("
Hai interrotto l&#039;invio"); 
return false; 
}
 
// funzione di controllo sul campo nome
function nome() { 
var controlla = document.forms[0].elements[0].value; 
if (controlla == "") { 
alert("
Non hai inserito il tuo nome.
 
Per favore inseriscilo.") 
document.forms[0].elements[0].focus(); 
return false; 
} 
return true;
} 
 
// funzione di controllo sul campo email
function email() { 
emailAddress=document.forms[0].elements[1].value; 
if (document.forms[0].elements[1].value == ""){ 
alert("
Non hai inserito l&#039;email del distinatario.") 
document.forms[0].elements[1].focus(); 
return false; 
} 
 
if (document.forms[0].elements[1].value.indexOf (&#039;@&#039;,0) == -1 || document.forms[0].elements[1].value.indexOf (&#039;.&#039;,0) == -1) { 
alert("
L&#039; E-mail deve contenere "@" e uno o più "."") 
 
document.forms[0].elements[1].select(); 
document.forms[0].elements[1].focus(); 
return false; 
} 
else
{ 
destin();
return true; 
} 
} 
//-->
</SCRIPT> 
</HEAD> 
 
<BODY bgcolor="white" > 
 
<FORM ENCTYPE="text/plain" NAME="form" METHOD=&#039;post&#039; ACTION=&#039;&#039; onSubmit="return submitForm()"> 
<table cellspacing="0" cellpadding="0" width="450">
<tr>
  <td><font face=verdana size=2>Il tuo nome:</font></td>
   <td><INPUT TYPE="text" SIZE="26" MAXLENGTH=40 ></td>
</tr>
<tr>
  <td><font face=verdana size=2>Email destinatario:</font></td>
    <td><INPUT TYPE="text" SIZE="26" MAXLENGTH=40 ></td>
</tr>
<tr>
  <td> </td>
    <td><INPUT TYPE="hidden"></td>
</tr>
<tr>
  <td><font face=verdana size=2>Commenti e suggerimenti:</font></td>
   <td><TEXTAREA NAME="Commenti " ROWS=6 COLS=30 wrap=virtual></TEXTAREA></td>
</tr>
<tr>
<td> </td>
<td><input type="submit" value="Spedisci"> 
<input type="reset" value="Reset"> </td>
</tr>
</table>
</form>
 
</body> 
</html>

Ecco qua: abbiamo inserito tre nuovi funzioni che effettuano un controllo sui dati inseriti:

  • function submitForm()
  • function nome()
  • function email()

Al momento di premere INVIO viene richiamata la funzione submitForm() che, a sua volta, controlla l'esatta compilazione dei campi Mittente ed Email destinatario. Se questi due controlli vanno a buon fine la funzione submitForm() richiama, finalmente, la già citata funzione destin() che provvede ad inviare il form.

Adesso non ci resta altro che implementare lo script nelle nostre pagine ed aspettare che qualcuno suggerisca il nostro sito a qualche amico :)

Pagina: 1 2 3 4 5

  • 6.138 visite
  • Voto negativoVoto positivo Vota: %SAIBAL_PERCENTAGE%%
    Loading...

link sponsorizzati

Consiglialo su Facebook


Lascia un Commento

Subscribe without commenting

Torna: [ Inizio ] [ Contenuti ] [ Categorie ] [ Cerca ]

Pagina renderizzata in soli 0,089 secondi dopo aver eseguito ben 0 query. Wordpress... prestazioni da urlo!