Script javascript: Form di invio mail lato client

   difficoltà:  script script script script script

Script simili
5/2/2007


Questo script in realtà non utilizza javascript, ma semplicemente html. Permette infatti di inviare mail da un form con il solo uso di html, senza linguaggi lato server (asp o php).
Il form permetterà di aprire il client di posta dell'utente, e in particolare una nuova mail già compilata e pronta per l'invio, prendendo il destinatario e l'oggetto dall' action del form e compilando il corpo della mail con tutti i campi presi dal form.
Vediamo l'esempio:

<form action="mailto:mail@email.it?subject=mail da sito web" enctype="text/plain" method="POST">
Nome <input type="text" name="nome"><br/>
E-Mail <input type="text" name="email"><br/>
Indirizzo <input type="text" name="indirizzo"><br/>
Città <input type="text" name="citta"><br/>
Testo<br/><textarea name="messaggio"></textarea><br/>
<input type="submit" name="Submit" value="Invia">
</form>

Verrà aperto outlook, thunderbird o qualunque altro client di posta con una e-mail precompilata con destinatario 'mail@email.it' e oggetto 'mail da sito web', in questo caso.
Avendo compilato i campi del form di contatto potremo ricevere un corpo della mail simile a questo:
nome=fabio
email=miamail@email.it
indirizzo=via milano4
citta=milano
messaggio=richiedo info su prodotto
Submit=Invia
La resa stilistica non è delle migliori..ma in un attimo si puo' creare il form di contatti con il solo uso di html.

Social:


Donazione:
Se questo script ti è stato utile e ti ho fatto risparmiare tempo e denaro fai una
qualsiasi cifra è ben accetta! 1€, 3€, 5€ ,10€, 50€ ;-) fai te!

Permalink: Tag:
invio   html   e-mail   form   script  
Script Simili: Permalink: Link utili:
Tools:
Feed RSS    



Commenti


  davide

6/2/2007 11:14:48

per mettere la compilazione dei campi obbligatori cosa bisogna fare?

  Fabio

6/2/2007 11:14:58

devi aggiungere uno script di controllo in javascript.
es. campo nome e email obbligatori.
Modifichi il form cosi:


<script>
function controllaform(){
Errore="";
if(document.getElementById('nome').value==""){Errore=Errore+"Campo nome obbligatorio\n";}
if(document.getElementById('email').value==""){Errore=Errore+"Campo email obbligatorio\n";}
if(Errore==""){
document.forms.inviodati.submit();
}else{
alert(Errore);
}
}
</script>

<form name="inviodati" action="mailto:mail@email.it?subject=mail da sito web" enctype="text/plain" method="POST">
Nome <input type="text" name="nome" id="nome"><br/>
E-Mail <input type="text" name="email" id="email"><br/>
Indirizzo <input type="text" name="indirizzo" id="indirizzo"><br/>
Città <input type="text" name="citta" id="citta"><br/>
Testo<br/><textarea name="messaggio" id="messaggio"></textarea><br/>
<input type="button" value="Invia" onclick="controllaform()">
</form>


  davide

6/2/2007 11:54:39

grazie per la risposta, ma non ho capito dove devo mettere lo script in javascript:
ho copiato e incollato in una pagina il tuo codice, salvato e provato ma non funziona l'invio e non mi viene fuori nessun messaggio di errore.
Ti chiedo scusa per i disagi ma sono un neofita nel campo della programmazione
grazie saluti

  Fabio

6/2/2007 12:09:50

riprovalo ora..avevo scritto velocemente e c'erano un paio di errori.

  davide

6/2/2007 12:28:08

grazie mille, tutto funziona.
Complimenti vivissimi per il sito e per l'utilità dello stesso,e la tua professionalità.
saluti
Davide

  raffaele

1/3/2007 21:03:41

buono

  Cauna

12/4/2007 19:45:28

Funzionare funziona, però alla mia email mi arriva un file allegato .att. Che roba é?

  Fabio

12/4/2007 20:10:56

un allegato .att? mai sentito. A me invia la mail senza alcun allegato.Hai provato su + mail?

su .att ho trovato questo: http://support.microsoft.com/kb/87379/it

  cioccorollo

17/4/2007 12:42:21

facile facile, cerca su google "att reader" apri i file con quel prog per leggerli o salvarli in altri formati ;)

  antonio

20/4/2007 12:57:35

Funziona benissimo, però capita che chi compila il form da un computer senza outlook poi non riesce a mandare il messaggio

  Fabio

20/4/2007 14:04:27

Beh non funziona solo con outlook. Anche con thunderbird e altri client di posta. Basta aver assegnato sul proprio computer un gestore di posta elettronica.

  j3n4

11/6/2007 16:55:56

si ma la mail lasciata così nel testo della pagina c'è il rischio che venga intercettata da qualche spider e finisce nell'elenco di qualche spammer... o no?
Non conviene mascherarla?

  j3n4

11/6/2007 17:09:22

ecco... infatti nella vostra pagina usate questo sistema: onclick="mailnospam etc etc

E mi sembra molto meglio.

Saluti
j3n4

  Fabio

11/6/2007 17:13:02

questa è una possibilità.. volendo si può mascherare facendo qualcosa tipo:


<script>
function inviaform(){
newaction="mailto:";
newaction=newaction+"nome";
newaction=newaction+"@";
newaction=newaction+"dominio";
newaction=newaction+".it?subject=mail da sito web";
document.forms.nomeform.action=newaction;
document.forms.nomeform.submit();
}
</script>

<form name="nomeform" enctype="text/plain" method="POST">
......................................
<input type="button" value="Invia" onclick="inviaform()">
</form>



  alòfa

26/6/2007 13:14:22

dopo aver mandato la mail tramite il form, vorrei che all'utente che ha usato il form e specificato la sua email venga mandata una mail da me che gli venga detto che la richiesta è stata inviata correttamentecome devo fare in php? grazie!

  Fabio

26/6/2007 14:09:24

Le soluzioni sono invio di due mail con php oppure se vuoi usare solo l'invio usato in questo script senza uso di linguaggi server side, potresti inviare tutte le mail del form a un tuo indirizzo in cui setti un risponditore automatico.

  alòfa

26/6/2007 21:25:35

ti ringrazio della risposta, ma un comando che esegua quello che ho sopracitato da aggiungere in un eventuale script già creato in php quale sarebbe?


  Fabio

26/6/2007 22:12:14

Ci son diversi script per inviare mail in php. Vedi ad esempio:

Invio mail in formato html con allegato

Se devi inviare 2 mail basta che ripeti la funzione cambiando mittente, destinatario, oggetto, corpo.


Sendmail("mittente@mail.it", "admin@mail.it","titolo", "testo");
Sendmail("admin@mail.it", "destinatario@mail.it","titolo", "mail inviata con successo");


  Glad

15/11/2007 1:04:14

ciao a tutti aveo bisogno di 2 aiuti ;
1-)
per mettere la compilazione dei campi obbligatori ho messo lo script


<script>
function controllaform(){
Errore="";
if(document.getElementById('nome').value==""){Errore=Errore+"Campo nome obbligatorio\n";}
if(document.getElementById('email').value==""){Errore=Errore+"Campo email obbligatorio\n";}
if(Errore==""){
document.forms.inviodati.submit();
}else{
alert(Errore);
}
}
</script>

ma nn funziona come mai ?

2-) con una email di hotmail funziona ?

  Fabio

15/11/2007 9:15:39

@Glad:
1- devi ricordarti di aggiungere nei campi oltre name='email' anche id='email' etc. e invece del submit:
<input type="button" value="Invia" onclick="controllaform()">
vedi un commento + in alto
2- certo perchè no?

  Glad

15/11/2007 23:28:45

non lo capito dove mettetelo , potresti dare una occhiata al codice che ho messo nella mia pagina ? e dirmi dove


<script>
function controllaform(){
Errore="";
if(document.getElementById('username').value==""){Errore=Errore+"Campo username obbligatorio\n";}
if(document.getElementById('email').value==""){Errore=Errore+"Campo email obbligatorio\n";}
if(document.getElementById('team').value==""){Errore=Errore+"Campo team obbligatorio\n";}
if(Errore==""){
document.forms.inviodati.submit();
}else{
alert(Errore);
}
}
</script>
<form name="inviodati" action="mailto:mail@email.it?subject=mail da sito web" enctype="text/plain" method="POST">
<p>Username<br />
<input type="text" name="username" id="username" />
<br />E-Mail<br />
<input type="text" name="email" id="email" />
<br/>
Team<br />
<input type="text" name="team" id="team" />
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="2">Messaggio</font><font face="Verdana, Arial, Helvetica, sans-serif" size="2">:</font><br />
<textarea name="Messaggio" rows="5" cols="32" wrap="VIRTUAL"></textarea>
<p>
<input type="submit" value=" Invia " name="submit" />
<input type="reset" value="Pulisci" name="reset" />
</p>
<p><br/>


  Fabio

15/11/2007 23:39:14

invece di:


<input type="submit" value=" Invia " name="submit" />

devi mettere

<input type="button" value="Invia" onclick="controllaform()">


  Glad

16/11/2007 0:07:13

ho sostituito
<input type="submit" value=" Invia " name="submit" />

con

<input type="button" value="Invia" onclick="controllaform()">

ma nessun risultato :(


  Glad

16/11/2007 0:10:26

scusa fabio avevo sbagliato io problema risolto grazie


  gennaro

26/11/2007 11:42:08

salve volevo sapere se è possibile fare la stessa cosa senza che si apra il programma di posta, cioè premendo su invia il dati vengono mandati direttamente

  Fabio

26/11/2007 11:50:49

Si può..ma usando linguaggi lato server tipo asp e php.
Se guardi tra questi script vedi qualche esempio per Inviare mail con asp e php. Se pero' non conosci asp o php non so quanto potranno aiutarti.

  Renzo

27/11/2007 23:49:54

Salve! Ho inserito nel mio modulo il seguente script trovato al capitolo "Script javascript: Form di invio mail lato client":

[....................]



  Fabio

28/11/2007 0:12:30

@Renzo:
taglio il tuo script perchè contiene dati personali. Inoltre vi prego di non postare intere pagine di script.

Arriviamo al tuo problema:
- Gli id dei campi devono essere scritti come quelli richiamati dal javascript (comprese maiuscole/minuscole) ->guarda destinazioni in particolare e provincia.
- Gli id non devono avere spazi


  Renzo

28/11/2007 14:23:50

GRAZIE!!!
Scusa per ieri ma non pensavo si pubblicasse tutto direttamente!
Funziona tutto perfettamente ma non riesco ad applicare lo script ai menù a tendina tipo il seguente(sarò breve!):

if(document.getElementById('mese_arrivo').value==""){Errore=Errore+"Campo mese_arrivo obbligatorio\n";}

<TD><SELECT name="mese_arrivo" size="1">
<OPTION selected>gennaio</OPTION> <OPTION>febbraio</OPTION>
<OPTION>marzo</OPTION> <OPTION>aprile</OPTION>
<OPTION>maggio</OPTION> <OPTION>giugno</OPTION>
<OPTION>luglio</OPTION> <OPTION>agosto</OPTION>
<OPTION>settembre</OPTION> <OPTION>ottobre</OPTION>
<OPTION>novembre</OPTION> <OPTION>dicembre</OPTION></SELECT></TD>

Scusa il disturbo!

  Fabio

28/11/2007 14:33:01

Nelle select mancano i valori.Es:
<OPTION value="marzo">marzo</OPTION>

Manca l'id alla select:
<SELECT name="mese_arrivo" id="mese_arrivo" size="1">

  Antonio

28/11/2007 16:59:39

Salve,
ho questo problema come posso fare arrivare il corpo del messaggio come allegato .txt ? qualcuno può aiutarmi Grazie

  Roberto

29/11/2007 14:53:09

salve,
ho questo problema, non riesco ad inviare foto come allegato, perchè mi dà errore di script e non mi invia niente, come devo fare a risolvere il problema? siccome sono profano in programmazione, mi dovete aiutare dall'inizio passo , passo, perchè ho cercato di leggere i commenti ma non ho capito dove devo scrivere <script> ect, c'è qualcuno che mi puo aiutare? grazie

  Fabio

29/11/2007 14:58:55

@Antonio
@Roberto
Per inviare allegati non potete usare questo script. Dovete utilizzare uno script lato server Asp o Php:
Inviare mail con asp e php


  io

14/3/2008 19:28:10

vorrei uno script che permetta ai miei utenti di inviarmi email con allegati di tuttini tipi

  davide

7/12/2009 12:12:25

salve, avrei un problema...ho costruito un form e vorrei che questo mi venisse mandato via mail una volta che è stato compilato, ma non ci riesco (premesso che uso html da 4 ore) potreste aiutarmi? lascio qui il form scritto

	
<center><H1>REQUEST</H1></center>
</head>
<BODY>
<BODY BGCOLOR="#C0C0C0">
<FORM>
<script>
function controllaform(){
Errore="";
if(document.getElementById('username').value==""){Errore=Errore+"Campo username obbligatorio\n";}
if(document.getElementById('email').value==""){Errore=Errore+"Campo email obbligatorio\n";}
if(document.getElementById('team').value==""){Errore=Errore+"Campo team obbligatorio\n";}
if(Errore==""){
document.forms.inviodati.submit();
}else{
alert(Errore);
}
}
</script>
<form name="inviodati" action="mailto:mail@email.it?subject=mail da sito web" enctype="text/plain

<H3>Shoulder Geometry</H3><SELECT size=1 cols=4 NAME="Sheet1 Material">
<OPTION selected Value=nessuna>
<OPTION value=Conical > Conical
<OPTION value=Cylindrical > Cylindrical
</select>
</BR>
</BR>
<INPUT type="TEXT" name="MAX Shoulder Diameter" maxlength="30" size="20" value="Diameter [mm]">
<INPUT type="TEXT" name="Shoulder Angle Inclination" maxlength="30" size="20" value="Angle Inclination [Deg]">
</BR>
<H3>Pin Geometry</H3><SELECT size=1 cols=4 NAME="Pin Geometry">
<OPTION selected Value=nessuna>
<OPTION value=Conical > Conical
<OPTION value=Cylindrical > Cylindrical
</select>
</BR>
</BR>
<INPUT type="TEXT" name="MAX Diameter Pin" maxlength="30" size="20" value="MAX Diameter [mm]">
<INPUT type="TEXT" name="Height Pin" maxlength="30" size="20" value="Height [mm]">
<INPUT type="TEXT" name="Angle Inclination Pin" maxlength="30" size="20" value="Angle Inclination [Deg]">

</BR>
<H3>Sheets Positioning</H3><UL TYPE=disc>
<LI><H4>But</H4><INPUT type="RADIO" name="voto" value="But">
<LI><H4>Lap</H4><INPUT type="RADIO" name="voto" value="Lap">
<LI><H4>L</H4><INPUT type="RADIO" name="voto" value="L">
<LI><H4>T</H4><INPUT type="RADIO" name="voto" value="T">
</UL>

<H3>Sheets Dimension</H3><UL TYPE=disc>
<L1><H4>Sheet 1</H4><INPUT type="TEXT" name="sheet1" maxlength="30" size="20" value="Length [mm]">
<INPUT type="TEXT" name="sheet1" maxlength="30" size="20" value="Width [mm]">
<INPUT type="TEXT" name="sheet1" maxlength="30" size="20" value="Thickness [mm]">
</BR>
<L1><H4>Sheet 2</H4><INPUT type="TEXT" name="sheet2" maxlength="30" size="20" value="Length [mm]">
<INPUT type="TEXT" name="sheet2" maxlength="30" size="20" value="Width [mm]">
<INPUT type="TEXT" name="sheet2" maxlength="30" size="20" value="Thickness [mm]">
</UL>



<H3>Sheets Material</H3><UL TYPE=disc>
<L1><H4>Sheet 1</H4><SELECT size=1 cols=4 NAME="Sheet1 Material">
<OPTION selected Value=nessuna>
<OPTION value=Aluminium > Aluminium
<OPTION value=Titanium > Titanium
<OPTION Value=Plexiglass > Plexiglass
</select>

<L1><H4>Sheet 2</H4><SELECT size=1 cols=4 NAME="Sheet2 Material">
<OPTION selected Value=nessuna>
<OPTION value=Aluminium > Aluminium
<OPTION value=Titanium > Titanium
<OPTION Value=Plexiglass > Plexiglass
</select>
</UL>
</BR>
</BR>
<H3>Comment<H3><TEXTAREA cols=50 rows=8 WRAP="physical" name="Comment"></textarea>
</BR>
</BR>
</BR>
<center><input type="button" value="Invia" onclick="controllaform()">
<INPUT type="Reset" value="Delete"></center>
</form>
</font>
</body>
</html>


  vincenza

11/12/2009 0:55:58

Ciao! ho fatto un semplicissimo form inserendo come action il mio indirizzo email, e sembra funzionare ma quando invio i dati nel body della email non c'è scritto niente, mentre mi aspettavo di avere il risulatato dei campi compilati. Come mai mi invia una mail vuota? Il codice è questo:

<form name="formTitle" action="mailto:continuando@libero.it?subject=Matrimonio"
method="post" enctype="text/plain">
<input type="submit" value="Invia" />

  semplicissimo form inserendo c

21/3/2010 8:25:55

semplicissimo form inserendo come action il mio indirizzo email, e sembra funzionare ma quando invio i dati nel body della email non c'è scritto niente, mentre mi aspettavo di avere il risulatato dei campi compilati. Come

  framzero

11/10/2010 17:24:38

Buondì. Ho usato il tuo codice e tutto funziona a perfezione. La prima volta.

Se, invece, provo a ripetere l'invio non mi si apre più nulla. Lo stesso succede già dalla prima volta con Chrome, mi sai aiutare?

  Christian

19/2/2012 23:37:54

Ciao, è possibile selezionare piu mail? Per esempio 2, o una o l'altra?


  ciccio

17/3/2012 14:36:28

salve a tutti....qualcuno mi sa dire come posso inviare i dati del form in un documento di testo sul dekstop??gentilissimi

  HelpMePlease

3/8/2012 15:48:54

Ciao a tutti, il codice funziona :-) Mi chiedevo se è possibile prevedere anche l'invio di un allegato oltre al messaggio testuale

  woolrich

14/8/2012 9:57:46

Se, invece, provo a ripetere l'invio non mi si apre più nulla. Lo stesso succede già dalla prima volta con Chrome, mi sai aiutare?



Lascia un commento


Codice di controllo*:
Nome*:
Email/Link:
Testo*:
 
I campi contrassegnati con * sono obbligatori.