Oggi voglio presentarvi la nuova versione del mio form di contatti php/mysql con antispam. In questa nuova versione ho tenuto conto dei vostri suggerimenti e consigli che mi aiutano ogni giorno a crescere e migliorare.
[lightgrey_box]ATTENZIONE: Sono disponibili anche le vecchie versioni di questo script: Versione 1.5 | Versione 1.0 (obsoleta)[/lightgrey_box]
Tra le aggiunte di maggior rilievo troviamo il tanto acclamato check dell’informativa sulla privacy (che ricordo essere obbligatorio per tutti i form di contatto web). Oltre a questo ho aggiunto un comodo loader con servizio di prevenzione di invio multiplo delle richieste. Non vi basta? sempre grazie alle vostre utili segnalazioni ho predisposto anche un check dell’indirizzo mail (deve contenere obbligatoriamente la chiocciola per un invio corretto). Ma andiamo con ordine.
[button link=”http://www.targetweb.it/tutorial/2012/form-contatti-php-2-0/index.html” color=”blue” target=”blank”]Demo[/button]
Struttura HTML
La struttura HTML è rimasta pressochè invariata rispetto allo script precedente. L’unica aggiunta degna di nota è sicuramente l’informativa della privacy tramite checkbox. Ecco lo scheletro HTML:
<form id="contact">
<p class="info_form">I campi con <span class="asterisco">(*)</span> sono obbligatori.</p>
<label for="nome">Nome <span class="asterisco">(*)</span></label>
<input type="text" name="nome" id="nome" placeholder="Il tuo nome" style="width:98%;" />
<label for="Email">Email <span class="asterisco">(*)</span></label>
<input type="text" name="email" id="email" placeholder="Digita la tua email" style="width:98%;" />
<label for="oggetto">Oggetto <span class="asterisco">(*)</span></label>
<input type="text" name="oggetto" id="oggetto" placeholder="Di che tipo di informazione hai bisogno?" style="width:98%;" />
<label for="messaggio">Richiesta <span class="asterisco">(*)</span></label>
<textarea cols="50" rows="10" name="messaggio" id="messaggio" placeholder="La tua richiesta" style="width:98%;" ></textarea>
<input type="checkbox" name="informativa" id="informativa" value="informativa" checked="checked"/> Accetto <a href="#" title="leggi la nostra informativa" class="informativa_link">l'informativa sulla privacy</a><br />
<input type="text" id="fred" name="fred" style="display:none;"/>
<br />
<input class="btn" type="button" id="bottone-contact" value="Invia Richiesta" />
</form>
Stile CSS
Anche lo stile CSS non ha subito variazioni significative. Ecco il codice essenziale:
#errori{ padding:10px; margin:10px 0px; border-bottom:2px solid #ce5757; text-shadow:1px 1px 1px #000; background:#e6abab; color:#fff;}
#risultato{ padding:10px; margin:10px 0px; border-bottom:2px solid #6090cc; text-shadow:1px 1px 1px #000; background:#abc6e6;color:#fff;}
.asterisco{ font-size:12px; color:#da9393;}
.info_form{ color:#7f7d7d; font-style:italic; font-size:14px; margin-top:-12px;}
Motore jQuery
Qui la vera rivoluzione. Preferisco postarvi subito il codice e analizzarlo in seguito.
//al click sul bottone del form
$("#bottone-contact").click(function(){
$(this).hide();
$("<img src='images/loader.gif' class='loader' />").appendTo("#contact");
var timer = 2000;
//associo variabili generali
var nome = $("#nome").val();
var messaggio = $("#messaggio").val();
var email = $("#email").val();
var oggetto = $("#oggetto").val();
var informativa = $("#informativa").attr('checked');
//pattern email
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
if(!emailReg.test(email)) {
$("#bottone-contact").show();
$("<div id='errori'></div>").appendTo("#contact").html("<span>Email scritta in modo non corretto! Controlla che sia presente la @</span>").delay(2000).fadeOut(timer);
$(".loader").hide();
} else if(informativa != "checked"){
alert("Devi accettare l'informativa sulla privacy per continuare!");
$("#bottone-contact").show();
$(".loader").hide();
} else if (nome == "" || email == "" ) {
$("#bottone-contact").show();
$("<div id='errori'></div>").appendTo("#contact").html("<span>Compila tutti i campi richiesti con l'asterisco!</span>").delay(2000).fadeOut(timer);
$(".loader").hide();
} //se ci sono campi vuoti
else { //se sono stati compilati tutti i campi
//chiamata ajax
$.ajax({
type: "POST",
url: "form/engine.php",
//il form invia i dati all'engine
data: "nome=" + nome + "&email=" + email + "&messaggio=" + messaggio + "&oggetto=" + oggetto,
dataType: "html",
success: function(msg)
{
$(".loader").hide();
$("<div id='risultato'></div>").appendTo("#contact").html("<span>Email inviata con successo!</span>").delay(3000).fadeOut(timer);
$("#bottone-contact").delay(2000).fadeIn();
},
error: function()
{
alert("Si e' verificato un errore imprevisto...");
}
});
}//else controlli
}); //fine form
Come vedete del source qui sopra dopo aver recuperato le variabili del form effettuo 3 controlli aggiuntivi rispetto alle precedenti versioni:
1) Controllo se il campo email contiene almeno la chiocciola. Se non ha la chiocciola è come se non fosse stato compilato correttamente e quindi restituisco un messaggio di errore personalizzabile. Il pattern per il check della mail viene riassunto in questa riga di codice, subito prima del controllo:
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
2) Controllo se l’informativa della privacy è stata lasciata selezionata (status: checked). Se non lo fosse restituisco l’errore tramite alert.
3) Ho predisposto che al click sul pulsante “Invia” quest’ultimo sparisca per evitare click (e quindi invii) multipli. Al suo posto appare un comodo spinner di loading che mette in attesa il visitatore fino a quando l’email non è stata processata. Quest’ultimo non era un vero e proprio “difetto” della precedente versione in quando la maggior parte degli utenti clicca solo una volta e aspetta la conferma. Tuttavia in effetti il problema delle mail multiple mi era stato segnalato e quindi ho deciso di rimediare.
Engine di invio mail
L’engine di invio email è praticamente invariato. L’unica nota che posso aggiungere rispetto alle precedenti release è che la variabile informativa può, di fatto,può essere non recuperata in quanto non apparirà nelle mail di conferma ma serve solo come “formalità”. Ecco il codice:
//Includo Variabili
include('config_email.php');
session_start();
$nome = $_POST['nome'];
$email = $_POST['email'];
$oggetto = $_POST['oggetto'];
$messaggio = $_POST['messaggio'];
$ip = $_SERVER['REMOTE_ADDR'];
//Verifica antispam
if($_POST['fred'] != "") {
echo('<p style="color: #000; font-size: 25px; font-weight: bold;">Sei uno spambot o stai usando tecniche di spam indesiderate, spiancenti ma ci siamo attrezzati. La mail non e stata inviata</p>');
}
else {
//Invio la mail
$to = $tua_email;
$sbj = "Richiesta Informazioni - $sito_internet";
$msg = "
<html>
<head>
<style type='text/css'>
body{
font-family:'Lucida Grande', Arial;
color:#333;
font-size:15px;
}
</style>
</head>
<body>
<table width='600' border='0' cellspacing='0' cellpadding='5'>
<tr>
<td width='121' align='right' valign='baseline'><strong>Nome:</strong></td>
<td width='459'>$nome</td>
</tr>
<tr>
<td align='right' valign='baseline'><strong>Email:</strong></td>
<td>$email</td>
</tr>
<tr>
<td width='121' align='right' valign='baseline'><strong>Oggetto:</strong></td>
<td width='459'>$oggetto</td>
</tr>
<tr>
<td align='right' valign='baseline'><strong>Richiesta:</strong></td>
<td>$messaggio</td>
</tr>
<tr>
<td align='right' valign='baseline'><strong>IP Tracciato (per motivi di sicurezza):</strong></td>
<td>$ip</td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><small>Powered by Targetweb.it | © Copyright 2012 Riccardo Mel</small></td>
</tr>
</table>
</body>
</html>
";
$from = $email;
$headers = 'MIME-Version: 1.0' . "\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\n"; //In certi casi con aruba se non viene formattata eliminare il \r per i permessi come ho fatto in questo caso
$headers .= "From: $from";
mail($to,$sbj,$msg,$headers); //Invio mail principale.
//Fine mail inviata a me
//Inizio email di conferma
$toClient = $email;
$msgClient = "
<html>
<head>
<style type='text/css'>
body{
font-family:'Lucida Grande', Arial;
color:#333;
font-size:15px;
}
</style>
</head>
<body>
<h1>Tuosito</h1>
<br />
<h2>Grazie, $nome</h2>
<br />
<p>Grazie per averci contattato, $nome</p>
<p>Abbiamo ricevuto la tua mail e ti ricontattermo prima possibile.</p>
<br />
<hr>
<p>Thanks for contact us, $nome</p>
<p>We received your email. We respond as soon as possible.</p>
</body>
</html>
";
$fromClient = $tua_email;
$sbjClient = "Grazie, $nome ";
$headersClient = 'MIME-Version: 1.0' . "\r\n";
$headersClient .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
$headersClient .= "From: $fromClient";
mail($toClient,$sbjClient,$msgClient,$headersClient); //mail inviata al cliente
//Fine email di conferma
//Resetto errori
session_destroy();
exit;
} //fine else del controllo antispam
Conclusioni e Download
[button link=”http://www.targetweb.it/tutorial/2012/form-contatti-php-2-0/index.html” color=”blue” target=”blank”]Demo[/button]
Licenza e condizioni d’uso: Lo script è usabile e modificabile in tutte le sue parti! E’ OBBLIGATORIO tenere almeno i riferimenti di targetweb.it sotto forma di commenti al codice e nella mail di invio (a voi non costa nulla!).
Vuoi aiutarmi a migliorare ancora questo script? Fammi sapere le tue opinioni nei commenti!
Dovresti mettere anche una verifica sui DNS … in quanto accetta nel campo email anche domini inesistenti. [email protected]
vabbè qui però andiamo sul “se uno vuole compilare a caso o senza senso” nemmeno contact form 7 o i più blasonati form ti bloccano le mail (provare per credere).
Il problema qui è la mancanza di espressioni regolari corrette per ogni campo (che accetta, tranne per la mail, anche 1 solo carattere).
Già un’espressione regolare completa rimuove email tipo quella che citi.
Se proprio vuoi aggiungere un qualcosa di più, senza rischiare di tagliare fuori email valide, puoi crearti un array con tutte le sigle degli stati (it,en,us,com, etc.) e fai tramite php un in_array(ESTENSIONE, LISTA_SIGLE).
Già che scrivo segnalo che se si preme più volte il tasto Invia compaiono messaggi di allerta multipli!
La soluzione postata annulla però i controlli predefiniti dell’html5 per via del Jquery.
Una soluzione più sicura e che tiene conto anche delle nuove funzioni dell’html5 è di fare i controlli in php nella pagina stessa lasciando vuoto il campo ‘action’ del form.
pagina form.php
“Se $_POST[‘submit’] -> controllo campi form e successive
ALTRIMENTI stampo il form normale”
Si bhè ovviamente c’è sempre da migliorare, tuttavia onestamente gli avvisi multipli non vedo come possano uscire dato che di base il bottone di invio scompare per qualche secondo appena cliccato proprio per evitare questo (click “impazienti”).
In secondo luogo usare la validazione HTML5 può risultare dannoso qualora il visitatore usi un browser tipo ie8 o precedenti che non supporta HTML5, quindi fossi in te starei (in generale), attento.
A me il pulsante rimane sempre visibile e cliccabile, uso Firefox Nightly.
Per la validazione, sono piuttosto pignolo, quindi non solo uso la validazione che impongo sui form html5, ma controllo anche quello che mi passa il form, quindi in teoria faccio almeno 1 controllo sui browser non html5 e 2 su quelli html5.
Ti scrivo due o tre appunti, magari li trovi utili:
– Avere troppi file sparpagliati (config, engine, etc.) aumenta il numero di richieste al server, sarebbe opportuno unire il tutto in un’unico file suddividendo eventualmente in classi le varie parti.
– Non affidarsi al solo controllo JS ma affiancare anche quello lato server, un utente con JS disabilitato potrebbe fare disastri in caso di mancata prevenzione.
– Lato server i campi vanno ripuliti (trim, etc)
– La checkbox sulla privacy all’inizio deve essere vuota, deve essere l’utente che attivamente la spunta (prendi esempio dalle finestre di installazione di qualsiasi programma, il tasto ‘successivo’ diventa attivo solo quando selezioni ‘accetto’).
Ciao Alex,
siccome ho anche io problemi con il form proposto da Riccardo, potresti spiegarti meglio? Magari riesco a correggere gli errori.
Grazie Adriano
Sinceramente il suo non l’ho provato, ho solo dato un’occhiata al codice.
Se mi dici che errori ti dà in particolare magari posso darti una mano, se riesco.
Sto lavorando in questi giorni proprio per trovare un modo funzionale per adattare per ogni casistica un form html5, una volta terminato e testato allego una traccia.
Ciao Alex,
grazie per l’aiuto.
Per validare a dovere il form ho usato validationEngine è un javascript molto valido che non lascia niente al caso con in più una carina grafica.
Ho unito in un unico file il config ed engine.
I problemi che ho riscontrato sono che se anche compilo a dovere tutti i campi mi compare il popup di errore
error: function()
{
alert(“Si e’ verificato un errore imprevisto…”);
poi sulla barra dell’indirizzo compare:
http://www.miosito.com/contatti/?name=Adriano&email=email%40mail.com&website=&message=prova
infine la cosa peggiore è che non mi arriva nessuna email.
A me premeva soprattutto il fatto che inviando il form non si venisse reindirizzati in nessun’altra pagina ma lavorasse tutto lato server.
Per non far indirizzare la pagina da nessuna parte al posto del pulsante submit ne metti uno generico (input type = ‘button’) e tramite js o jquery imponi che quando fai un click ci sia il controllo dei campi.
script JS:
al click del pulsante INVIA:
controllo i campi:
-> i campi sono errati, mostra errori
-> i campi sono corretti:
invia tramite ajax i dati in POST a una pagina php (controllo.php nell’esempio) e attendi risposta.
– > ottieni il risultato:
-> è positivo -> stampa un messaggio di avvenuto invio
-> è negativo -> stampa un messaggio di errore o quel che serve
controllo.php
-> controllo ogni variabile passata ($_POST[‘name’], $_POST[’email’], etc) con espressione regolare.
– > tutto positivo ->manda la mail e ritorna all’ajax un messaggio positivo
-> ci sono errori -> ritorna all’ajax un messaggio di errore segnalando cosa è sbagliato
La struttura del form in questo caso è
campi
<input type="button"…
(Senza vedere il codice di quello che hai fatto non posso dire molto di più).
Appena avrò messo a punto quel che dicevo prima all’autore del post lo condivido.
Vorrei trovare un modo per unire al meglio l’html5 con i controlli JS e PHP.
Sisi lo so … era giusto per …
Se si trovasse il modo per aggiungerci anche l’invio di un allegato sarebbe perfetto!
Sto provando a lavorarci su, ma senza successo!
La questione allegati secondo me va divisa in due:
A) Allegato che si salva nel webserver del sito e nel database dello stesso (soluzione da preferire)
B) Allegato alla mail di contatto.
Quale ti interessava?
La seconda che hai detto…
dovrei metterla in un sito che non ha db.
Memorizzarla sul server non servirebbe
Ciao Nick fare si può fare tutto =D il primo caso è sicuramente molto più semplice e sicuro, onestamente non ho mai avuto la necessità di dover allegare un file direttamente alla mail quindi così su due piedi non saprei come aiutarti. Di sicuro dovrai predisporre un controllo dell’estensione del file (altrimenti riceverai virus e spam a volontà). La soluzione più facile che mi viene in mente è: mail normale con link per scaricare l’allegato che è stato salvato nel tuo web server in una cartella (es. attach). IN questo modo quando arriva la mail cliccando sul link si scarica l’allegato.
ciao, come posso aumentare il contenuto del messaggio che uno invia dal sito?
Se intendi aumentare la lunghezza della textarea devi agire sulle row (numero di righe) e col (numero di colonne).
Davvero un ottimo lavoro!
Ciao Riccardo, secondo me un controllo captcha è da inserire, per limitare lo spam!
Il CAPTCHA onestamente serve a poco. Quasi tutti sono stati craccati, incluso il reCAPTCHA di Google (purtroppo ne so qualcosa)
In questo caso il CAPTCHA è l’input hidden. Poi se qualcuno vuole è libero di inserire un CAPTCHA qualsiasi 🙂
Valuterei anche un refresh del form, in modo tale che quando l’utente invia il messaggio non rimanga tutto ancora precompilato, ma i campi si svuotino
Ehm…Scusa la domanda balorda. Ma dove lo includi il file contatti.php da cui poi parte la mail?
rispondo io, anche se è passato qualche giorno. È il file engine.php della cartella /form
Ehm. si…questo lo avevo capito…ma dove lo chiami per farlo funzionare? Nel codice non ci sono collegamenti al file engine.php…
Ciao, ottimo tutorial, ma nel check della mail si potrebbero aggiungere un paio di informazioni.
Il carattere punto (.) non è consentito nel nome della casella come primo o ultimo carattere e come primo carattere del server
Quindi i seguenti indirizzi sono tutti NON validi:
[email protected]
[email protected]
[email protected]
Maggiori info qui: http://tools.ietf.org/html/rfc3696
Un ulteriore step potrebbe essere quello di includere una verifica immediata dell’esistenza della mail tramite controllo SMTP, ma è possibile che alcuni provider non diano una risposta “corretta”. In tal caso bisognerebbe inserire solo un avviso che non blocca comunque l’invio del form, indicante “Attenzione, l’indirizzo email immesso non sembra esistente. Verificane la correttezza”.
Ciao,
vorrei sapere come rendere obbligatori altri campi che ho aggiunto nel form.
Grazie
Basta aggiungere così:
1)
[...] || campo1 == "" || campo2 == "" [...]Riga 31 del codice articolo.2)
var campo1 = $("#campo1 ").val();Riga 10 (e successive) articolo.3) Ovviamente anche gli input e l’inizio dello script devono essere tarati con il rispettivo id univoco:
input type="text" name="campo1" id="campo1"Fammi sapere se hai bisogno di altro 😉
P.s Grazie agli altri per i suggerimenti, credo che nella prossima versione implementerò il check smtp 😉
Grazie mille!
volevo informarti che nell’email di conferma che arriva a chi sottoscrive il form, non si vede:
“Powered by Targetweb.it | © Copyright 2012 Riccardo Mel” mentre si vede nell’email che arriva al proprietario del sito.
E’ giusto?
un ultima cosa! è possibile dopo l’invio del form, e dopo il messaggio di corretto invio, resettare i campi e magari reindirizzare ad un’altra pagina?
Grazie mille?
Per il reset dei campi basta che metti dopo success: ( RIGA 52 ) i codici che vedi in questo articolo:
http://www.targetweb.it/reset-campi-di-un-form-con-jquery/
Se vuoi invece reindirizzare a un’altra pagina sempre dopo success ( RIGA 52 ) basta usare javascript usando location href (cerca su Google ;))
EnjoY!
Se metto però il reset dei campi
$(':text, :email, :url').val('');
dopo success alla riga 52, in caso di errore imprevisto
error: function()
{
alert("Si e' verificato un errore imprevisto...");)
i campi si resettano ugualmente, e invece non dovrebbe succedere visto che la mail non è stata inviata!!!
Ciao Riccardo, complimenti per l’articolo e il form.
Ho notato però un errore, e cioè se “ispeziono” il tuo form e rendo visibile il campo “fred” compilandolo, la mail viene inviata lo stesso dandomi come risultato: Email inviata con successo!
…spero che le demo dei form non contengano la tua mail sennò avresti la mail intasata… 😉
Ciao, grazie per aver messo a disposizione il form. Ho provato ad aggiungere altri campi, ma il testo inserito nei nuovi campi non compare nella mail che mi arriva.
Per ora li ho aggiunti in targetcontactform.js alle variabili generali e al punto “//il form invia i dati all’engine” e in engine.php al punto “//Includo Variabili”.
Ho anche creato i campi nella tabella della mail che deve arrivare a me e questa mi arriva con i nuovi campi vuoti.
Spero di essere stato chiaro. Che cosa sto sbagliando?
RISOLTO!!!
Ottimo, per tutti gli altri visitatori: oltre alle modifiche all’html e allo script del form se aggiungete campi dovete modificare anche il file engine.php con il relativo recupero dati (POST) e ovviamente includete nella mail la relativa variabile per farla apparire correttamente.
Ciao!
ottimo lavoro! molto pulito e semplice!
solo ho un problema che non riesco a risolvere,
vorrei che alcuni campi non fossero obbligatori (senza asterisco)
ma se elimino le variabili nel file .js per esempio
var nome = $("#nome").val();
poi non mi invia le informazioni nella mail nel caso che vengano compilati!
non capisco proprio cosa devo fare..
grazie mille!
Anche io vorrei sapere come inserire dei campi non obbligatori.
Non devi eliminare quella parte ma da questa:
else if (nome == “” || email == “” )
eliminare il campo che non vuoi che sia obbligatorio, ad esempio se vuoi lasciare la possibilità di non inserire il nome devi fare:
else if (email == “” )
Dovrebbe funzionare se non ho capito male! 😉
Ciao. Volevo solo dirti che la spunta sulla normativa privacy così non va bene. Dovresti lasciarlo senza essere flaggato di default, in modo che sia l’utente a doverlo spuntare. Ciao e ottimo lavoro, spero di sistemare il mio.
Si in effetti mi sono informato anche io sulla privacy, di base va lasciata uncheked (basta rimuovere il relativo attributo in HTML).
Per i campi obbligatori invece devi rimuovere l’elemento da NON rendere obbligatorio alla riga [31]. Se rimuovi il val() è logico che non ti invia quel valore perchè non riesce a recuperarlo ;). Viceversa ovviamente aggiungete lì eventuali altri campi obbligatori (se ne aggiungete altri ricordati di recuperare i valori anche nel file PHP che invia la mail):
Per chi mi chiedeva dove fosse il load del file engine.php … riga 46 del file JS.
Nella prossima versione credo implementerò il check SMTP, e maggiore semplicità automatizzata nella scelta dei campi obbligatori/liberi per i meno smanettoni al codice 😉
Salve, ho condiviso l’articolo ma non riesco a scaricare i file, help me 🙂
Sei il primo Roberto, una volta scaricato dovrebbe sparirti l’overlay blu e nello stesso punto apparire il link per scaricare 😉 se non va fai uno screenshot e caricalo su un image hosting oppure contattami ad riky.mel at gmail dot com
Ti ho inviato una mail 🙂
Come posso usare questo script con WP? mi da sempre error:
function()
{
alert(“Si e’ verificato un errore imprevisto…”);
}
è come se non entra nel php $.ajax({
type: “POST”,
url: “form/engine.php”,
Chi mi sa dare un consiglio?
Hai il mio stesso problema, e io sul mio sito non ho ancora installato WP, quindi non credo dipenda da quello ma da un errore nell’htm e nello script:
normalmente il codice andrebbe
e nei 3 if andrebbe alla fine un return false; sennò non convaliderebbe mai come veritiero il quesito “se avviene questo allora fai… altrimenti ritorna falso e passa all’allora se…”
però non sono pienamente sicuro visto che il codice non l’ho scritto io…spero solo Riccardo ci dia una risposta!!!
L’alert è dovuto al fatto che il file php engine.php non viene trovato, prbabilmente verificate il percorso o usate un percorso assoluto, in questo modo siete sicuri che il file di elaborazione sia caricato correttamente 😉
Ma anche mettendo il valore assoluto, quindi
url: "form/engine.php",diventa così
url: "http://www.miosito.com/form/engine.php",mi da l’alert
Ragazzi, io ho risolto questo problema consultandomi su stackoverflow, ora vi do il link. http://stackoverflow.com/questions/13767166/use-a-php-file-from-a-js-in-wordpress
la domanda è… perchè mettevi lo slash davanti all’url? =D
Per indicare che si trovavano insieme, avevo già provato senza, alla fine ho messo il code all’ ultima prova, mi è stato consigliato anche di mettere ./set.php ,devo provare e vedere se funziona, ma appena avrò un po’ più di tempo
crea un file vuoto php con una funzione mail base per testare se il tuo server riesce a spedire con la funzione mail. Dopodichè testalo con un percorso diretto es. http://www.tuosito.it/form/test.php e vedi se invia.
Riccardo, il server riesce a spedirmi la mail (sia di base che col tuo codice inserendo il link diretto), però il problema è che l’alert compare ugualmente e poi la pagina si blocca sul percorso http://www.miosito.com/form/engine.php (logicamente con pagina bianca)
Non saprei se invia la mail correttamente basta che elimini l’alert e sei a posto no? (anche se è strano ovviamente).
Ciao Adriano..
Ho il tuo stesso problema.. ho installato il footer su diversi temi di un wordpress multisite, mettendo i codici del form su una cartella separata nella root.. la mail viene inviata e ricevuta ma appare l’allert..
temo che sia un problema di compatibilità di jquery, ma sono stato attento a inserirlo in modo corretto..
Hai per caso trovato una soluzione?
grazie,
(e grazie Riccardo per lo script)
Ciao Stefano,
purtroppo non ho ancora adesso trovato una soluzione, a dire il vero non ho ancora capito dove risiede il problema, se nella pagina html, php o nel jscript.
Dici un problema di compatibilità del jquery? ho provato ad usare le stesse librerie del form qui sopra…
il problema è che il form qui sopra funziona solo se non viene modificato, e non credo che la colpa sia solo nostra visto che io e te non siamo gli unici ad avere questo problema, ho paura che ci sia da modificare qualche altro pezzo di codice.
Nel frattempo ho pure esposto il problema anche ad un forum, però nemmeno lì sono riusciti ad aiutarmi molto…
Se nel frattempo hai trovato tu una soluzione fammelo sapere.
Grazie Adriano
Ciao Riccardo
ho letto un pò tutto e siccome cercavo un modulo contatti ho utilizzato il tuo che mi sembra piuttosto bello, ma non riesco a farlo funzionare sembra che non funzioni bene il tasto invia.
Mi puoi dare un aiuto
Grazie
In che senso “non funziona bene il tasto invia”? =D
Nel senso che cliccando sul bottone invia non succede nulla.
Ho copiato i vari file nelle cartelle corrispondenti e inserito l’e-mail su cui inviare sul file config.php
Ho tralasciato qualcosa?
Grazie
Ovviamente hai inserito anche le librerie jQuery giusto ;)? l’ID del pulsante di invio è impostato correttamente (es. button id=”prova” e nel file js devi mettere $(‘#prova’).click function etc….)
Ovviamente hai inserito anche le librerie ?????
Ho copiato “targetcontactform.js” dentro la relativa cartella “js”
Quali sono le altre librerie?
Nel file contatti.html ho ripreso dal tuo index.html il seguente codice e l’ho inserito ad inizio modulo
Verifica di aver inserito anche le librerie jQuery. Guarda qui per maggiori info:
http://www.targetweb.it/iniziare-con-jquery-le-basi-indispensabili/
Ciao Riccardo,
complimenti per il tuo lavoro!
Volevo segalarti che c’è un problema di invio/ricezione email con liberomail, sia quando viene impostata [email protected] come
$tua_email, sia quando [email protected] viene inserita nel campo del form da un potenziale richiedente. Deduco che se succede con liberomail, questo possa avvenire anche con altri provider…Naturalmente ho effettuato diversi test da server locale, ad esempio con gmail e yahoo tutto viene recapitato perfettamente.
P. S. Preciso che non si riceve niente nemmeno in “spam”. 😉
Rettifico: il problema era dovuto, appunto, al fatto di lavorare in locale, in remoto funziona correttamente.
Salve riccardo, complimenti per i tuoi lavori ti seguo spesso.
ho provato il tuo form e riscontro un problemino: ho inserito tre form nella stessa pagina naturalmente rinominando il nome dello stesso, il pulsante, e cambiando dei campi, ho modificato anche il js e l’engine.php ora non capisco perche solo uno ne funziona gli altri mi danno sempre l’errore di compilare tutti i campi con l’asterisco, mi sto esaurendo ho ricontrollato un centinaio di volte il js, html, e engine ma a me sembra tutto ok qualche consiglio? grazie per la disponibilità
Marco
Ciao Marco nel caso di un uso multiplo devi necessariamente creare ID diversi es. #pulsante1 #pulsante2 etc. Oltre ai pulsanti devi dare ID diversi anche al form e ai vari campi. Quasi sicuramente il problema risiede lì 😉
Grazie della tua celerità nella risposta, ho dato un nome diverso a tutto, ho fatto una prova, ho incollato il contenuto del form html non funzionante, nel div di quello che funzionava di nome #box, e tutto funziona.
ma può essere che li sia il problema perche quello non funzionante risiede nel div #box_prova_gratuita.
se si come correggerlo ne js? grazie della tua pazienza Marco.
Ciao Riccardo, sopratutto complimenti per l’ottimo form che hai creato, avrei un problema ho provato ad aggiungere campi al form e poi li ho anche inseriti come hai specificato tu anche nei file js e php necessari per l’invio; faccio una prova e la mail la invia correttamente e fino quà tutto ok ma appena il messaggio arriva nella mail specificata nel file “config_email.php” il nome e il cognome (parametro che ho aggiunto io) vengono inseriti assieme nello stesso campo(ti elenco la mail che ricevo dopo aver compilato il form):
Richiesta Informazione
Nome: Mariocognome=rossi
Cognome:
Email: [email protected]
Oggetto: quanto costa la casa??
Richiesta: un po’
IP tracciato: (funziona)
Secondo te cosa determina quel problema che hanno il nome e il cognome??
Riccardo risolto il problema mi ero dimenticato di inserire una variale nel file .js!!
Ottimo 😉
Ciao Riccardo,
complimenti per il lavoro svolto, tutto funziona perfettamente, se non per un particolare, quando la mai arriva non mostra correttamente i caratteri accentati, ad esempio:
è una prova, andrà? -> diventa -> è una prova, andrà ?
Ho provato ad aggiungere al file “engine.php” la codifica UTF-8, ma nulla.
Grazie per l’attenzione.
Ciao Antonio lo fa anche con ` etc ? oppure prova con il semplice apostrofo…
E’ la mail scritta dall’utente, quindi viene compilata da tastiera utilizzando i caratteri accentati, questo per dirti che non ho “governo” su come l’utente scrive. Solo solo soletto ad avere questo problema? Mi sembra molto strano! non sia stato notato prima, siamo in tanti ad averlo utilizzato.
Ciao Riccardo, ti segnalo che sono venuto a capo del problema, nel file “engine.php” ci sono dei piccoli errori nella gestione dell’header alla riga 87 (o giù di lì).
Io ho risolto il problema inserendo al posto di:
$headers = 'MIME-Version: 1.0' . "\n";
$headers .= "Content-type: text/html; charset=utf-8\n";
questo:
$headers = "MIME-Version: 1.0\n";
$headers .= "Content-type: text/html; charset=utf-8\n";
Grazie della segnalazione Antonio 😉
Ciao Riccardo,
sto provando a mettere il form sul mio sito web, ho seguito tutti i passaggi però quando vado a fare una prova di invio, clicco sul bottone “invia richiesta” e non succede niente..sapresti aiutarmi?
grazie
Ciao Daniela, ecco alcune ipotesi (non avendo il codice è dura…):
A) Hai inserito le librerie jQuery nel documento?
B) hai collegato il giusto ID del bottone di invio? es. #bottone-invio deve corrispondere sia nell’html che nel JS
C) prima a eliminare il codice e testare un semplice alert al click sul bottone di invio dati. Se non funziona mancano le librerie o c’è qualcosa che va in conflitto.
io ho lasciato il codice così come l’ho trovato nel file zip…ho solo aggiunto nel della pagina html questo
ho solo aggiunto questo fra le *
Ciao, volevo chiedervi è possibile aggiungere un campo per l’invio di una copia del messaggio all’utente che lo compila?
Grazie
Ciao Luigi, certamente che lo puoi fare però devi modificare il file engine.php in modo che all’utente che compila il form non arrivi solo l’auto-responder ma anche la copia della mail che arriva a te. Per farlo basta duplicare il codice php che genera la mail che arriva a te e invertire le variabili $from (mittente) e $to (destinatario) ed il gioco è fatto.
Grazie Riccardo! E’ davvero un bel form: completo, efficace e semplicissimo per chi, come me, ha ancora dificoltà nella programmazione. Accetti donazioni?
Grazie ancora :-)!
Ciao Riccardo, sto cercando di implementare al tuo form l’inserimento dei dati in database mysql, sfruttandolo come form di registrazione ma non riesco a far inserire i dati nel db. Nel file engine.php dovrebbe esserci un controllo del db e una query ma come sto procedendo non riesce ad inserirli. Qualche idea? Grazie per il tutorial!
Ciao, grazie per la guida, il tuo form funziona benissimo. Ora però ho un problema: questo form invia tramite la funzione mail, io avrei bisogno di caricarlo su un server dove la funzione mail è disattivata… ho letto in giro che l’unico modo è usare l’SMTP tramite phpmailer.
Io me lo sono scaricato e ho caricato il file phpmailer.inc.php sul server insieme agli altri, poi mi è venuto fuori questo codice che dovrei inserire:
il problema mio è capire dove e come devo inserirlo… so veramente poco di php… a logica mia dovrei metterlo al posto di quello che ad oggi c’è nel file config_email.php, ma poi? basta fare così e funziona tutto o bisogna fare anche altre modifiche?
grazie!
Ciao, ho provato il tuo form, diciamo che la versione vecchia mi funzionava bene, mentre la nuova ho provato a configurarla, ho disattivato il checked automatico ma anche quando lo selezioni risponde sempre che bisogna accettare le condizioni sulla privacy? succede anche a voi? grazie mille
Hai riguardo bene la logica del js?
Salve, anch’io ho lo stessa problema di Federico, quando vado a selezionare la casella risponde sempre di selezionare la casella dell’informativa. stessa logica .js . Help
ciao,
ho provato il tuo script ma anche senza modificarlo, utilizzando quello scaricato, mi da al momento del clic invia, “java errore imprevisto”…. idee????
grazie
Come detto in altri commenti, devi verificare che il percorso ajax al file php di elaborazione dati sia correttamente impostato (prova con il percorso assoluto se non ne sei sicuro).
Ciao Riccardo, ti volevo chiedere come posso inserire 2 form in una stessa pagina. (uno per iscrizione newsletter e l’altro contatti) Ti spiego.. ho creato 2 form con e con i rispettivi engine1.php e engine2.php e targetcontactform1.js e targetcontactform2.js. Nei rispettivi js ho impostato “//al click sul bottone del form $(“#bottone-1″).click(function(){” e //al click sul bottone del form $(“#bottone-2”).click(function(){ modificando anche la chiamata ajax rispettiva degli engine e tutti gli .appendTo che chiamano i rispettivi form.
A questo punto però (caricando i 2 script nella pagina) quando compilo il form newsletter non mi fa spedire la mail se non compilo anche tutto il form contatti dove ho richiesto la validazione dei campi, mentre al contrario riempiendo solo il form contatti mi fa spedire senza problemi è come che ci fosse una connessione a senso unico tra i 2 form ma a livello di codice comunicano con 2 js e engine diversi.
Ps alcuni nomi e id dei campi sono uguali.
Mi sai aiutare?
Grazie 1000
Ok risolto era un problema di id uguali 🙂
Ciao, per prima cosa i miei doverosi apprezzamenti! gran bel form! 🙂
Se volessi inserire correttamente un codice di tracking (google adw)…? Grazie per eventuali suggerimenti
Ciao Riccardo, ottimo form complimenti!
Volevo chiederti se è possibile formattare il box alert per esempio “Devi accettare l’informativa sulla privacy per continuare!”
Grazie
Ciao, volevo provare “al volo” il tuo form. Basta scaricarlo, modificare la mail in config_email.php e pubblicarlo. E’ sufficiente questo?
Grazie
Si 😉 se cambi il posizionamento al file js devi ovviamente cambiare anche il percorso al js altrimenti te ne accorgi perchè ti restituisce “chiamata fallita”. Ovviamente devi metterlo in un hosting che supporta la funzione mail di php.
Ciao Riccardo, provato e… soddisfatto. Vorrei chiederti: 1) al momento dell’invio, mi da la conferma ma rimangono i campi ancora con i dati – cosa dovrei aggiungere per “ripulirlo”; 2) vorrei implementarlo: nella struttura html aggiungo i campi di cui necessito (per esempio, nazioni):
nella STRUTTURA:
Città
Afghanistan
Albania
nel MOTORE:
//associo variabili generali
var nome = $(“#nome”).val();
var messaggio = $(“#messaggio”).val();
var email = $(“#email”).val();
var oggetto = $(“#oggetto”).val();
var Città = $(“#Città”).val();
var informativa = $(“#informativa”).attr(‘checked’);
nell’ENGINE:
//Includo Variabili
include(‘config_email.php’);
session_start();
$nome = $_POST[‘nome’];
$email = $_POST[’email’];
$oggetto = $_POST[‘oggetto’];
$messaggio = $_POST[‘messaggio’];
$Città = $_POST[‘Città’];
$ip = $_SERVER[‘REMOTE_ADDR’];
//Verifica antispam
Pensi possa funzionare… Grazie
Ciao!
Intendo utilizzare il form, che mi sembra essere l’unico che funziona bene.
Una domanda: secondo te, il campo testo “textarea” si può fissare nelle dimensioni nel Css?
Anche nella tua demo qui sopra puoi modificare l’area, ed andare fuori margini….non è molto bello.
Io dovrò mettere il form in un e non posso permettermi di andare fuori dall’area.
Per il resto nessun problema, dalle prove che ho fatto sinora…ho messo tutto in una cartella annidata, così posso far funzionare il form in modo autonomo, senza dipendere dagli stili del sito principale. Chiaramente bisogna copiare la grafica e smanazzare un pò il codice…
grazie.
Ciao Alberto per le textarea devi usare cols e row per settare l’altezza (row) e larghezza (cols). in teoria comunque si puoi anche mettere height:XXpx; Usa max-width:100%; per renderla auto-adattata al div.
Grazie mille! Davvero utile
Ciao Riccardo complimenti davvero per il tuo buon lavoro!
Non ho avuto alcun problema per l’installazione, ma non so come tracciare una eventuale pagina di conferma di invio del form attraverso Google Analytics.
Dopo l’invio del form vorrei far atterrare l’utente su una pagina specifica (es. thankyoul.html).
Come posso fare?
grazie e buona giornata
Usa un redirect dopo ajax success, in questo modo lo mandi dove vuoi solo quando va tutto a buon fine; volendo puoi altresì fare un tracking della mail (un altro spunto per un articolo direi ;)).
Ciao,
mi è stato chiesto di implementare un sistema antispam, in PHP, tu che preventivo faresti ad un tuo cliente? Scusa per l’introduzione. Buon lavoro.
Ciao Riccardo,
non riesco a scaricare la demo. 😉
ciao, sto usando il tuo form da circa un mese e mi trovo benissimo, ne ho trovati parecchi in giro ma credo che questo sia uno dei migliori, da circa una settimana però ho un problema… mi sono arrivate delle mail vuote, cioè mail senza indirizzo della persona che ha inviato e tutti i campi vuoti… non so da cosa dipenda, se provo a usare io il form funziona benissimo, compreso il controllo sull’indirizzo mail, e le mie prove arrivano perfette, non riesco a spiegarmi come sia possibile iniviare mail vuote da lì!
e sono sicura che arrivino da quel form perchè ho provato anche a cambiare indirizzo mail e hanno iniziato ad arrivarmi su quello nuovo.
hai idea di dove potrebbe essere l’errore?
ho fatto prove anche da dispositivi mobile, altri pc, altri browser e non riesco a spiegarmi come sia possibile la cosa perchè tutti i controlli sembrano funzionare… aiutami!!!
grazie!
Ciao Anna, probabilmente il tuo sito è stato preso di mira da qualche spammer che usa il tag no-script per ovviare i controlli JS. Per impedirli di inviarti la richiesta inserisci questo codice dentro l’head del tuo sito:
< noscript > < style >form{ display: none;}< /style > < /noscript >P.s Elimina gli spazi tra i tag
Lato PHP invece dentro l’engine effettua un controllo PRELIMINARE per verificare se tutti i campi essenziali sono stati compilati (Nome,Email) in questo modo:
Spero ti sia utile, fammi sapere! (Ps. prova anche il mio nuovo targetValidator, lo trovi qui: goo.gl/dTZC8 ).
I’d like to thank you for the efforts you have put in writing this website. I’m hoping to view the
same high-grade blog posts from you in the future as well.
In fact, your creative writing abilities has inspired me to get my own site now 😉
Ciao a tutti, ma compilando il campo “fred” la mail viene inviata ugualmente!! sbaglio io!?
Ciao, sono alle prime armi ed ero alla ricerca di un contact form già pronto, Ho riscontrato il tuo form ma non ho capito bene come installarlo. Sapresti spiegarmelo?
Funziona tutto perfettamente.
L’unico problema che ho è con le parole accentate che ho sull’email che ricevo. (pagina web in lingua spagnola)
Come lo posso risolvere?
ciao
RISOLTO
ahh ed ho un altro problemino: quando si clicca sul bottone per inviare il messaggio dalla web… mi esce una pagina bianca… senza “grazie”, nè conferma di invio messaggio, nè redirezionamento alla web.
Cosa sto facendo male?
ciao Riccardo
potresti spiegare come inserire in questo form un invio allegato, magari con restrizione file, un select, e 2 radio di validazione.
Grazie
ma per inviare gli allgati come si fa ???
help meeee … mi serve come feature…
grazie
E’ possibile scaricare il form con gli errori corretti?
Ti consiglio di provare il plugin di validazione aggiornato a questo indirizzo:
http://www.targetweb.it/plugin-validazione-form-jquery-targetvalidator/
L’url di chiamata è questo giusto? perchè non ricevo alcun messaggio?
//chiamata ajax
$.ajax({
type: “POST”,
url: “form/engine.php”,
Si è quello tuttavia dipende da dove lo implementi (sudirectory, cms etc)…per un test usa un url assoluto al file engine.php…
Salve nessuno sa come ripulire i campi dopo l’invio?? Gli utenti inviano due tre mail e comincia ad essere antipatico grazie per l’aiuto
Ciao, guarda qui:
http://www.targetweb.it/reset-campi-di-un-form-con-jquery/
Grazie Riccardo ho inserito le righe da te suggerite dopo il success così:
success: function(msg)
{
$(“.loader”).hide();
$(“”).appendTo(“#contact_utenza”).html(“Email inviata con successo!”).delay(3000).fadeOut(timer);
$(“#bottone_utenza”).delay(2000).fadeIn();
//Imposta il valore dei campi di testo come vuoto grazie a val()
$(‘:text, :password, :file’).val(”); // Deseleziona checkbox, radio e select
// Rimuove il check da checkboxes e option
$(‘:input,select option, checkbox’).removeAttr(‘checked’).removeAttr(‘selected’);
// Seleziona il primo valore della select
$(‘select option:first’).attr(‘selected’,true);
},
Ma nulla i campi non si azzerano 🙁
Salve, è un messaggio per Marco (non so quando abbia postato perché non ci sono le date sui post, quindi spero non sia passato troppo tempo).
Comunque, anche io avevo lo stesso problema e ho risolto così:
success: function(msg)
{
$(“.loader”).hide();
$(“”).appendTo(“#contact”).html(“Email inviata con successo!”).delay(3000).fadeOut(timer);
$(“#bottone-contact”).delay(4000).fadeIn();
$(‘#contact’)[0].reset();
},
Con il reset, dopo che l’utente ha cliccato, si azzerano campi. Nono sono molto esperta, quindi no so se sia una soluzione ottimale, però funziona.
Ciao
Ciao!
Uso il tuo Form già da un po e mi trovo molto bene.
Mi servirebbe un consiglio e un aiuto!!!
Vorrei fare in modo che in base alla scelta fatta in un campo con valori predefiniti (menu a tendina) l’email che invia abbia un contenuto diverso.
E’ possibile?
Si può inserire un controllo sul file engine.php?
Grazie
Nessun aiuto?
Altra domanda!!!
Ho aggiunto ulteriori campi nel form, nel .js e nel file engine.php ma la mail che arriva mostra solo i primi 9 campi + il valore IP.
c’è un limite al numero dei capi ?
Risolto! errore di sintassi!
Ciao Roberto, scusa del ritardo..ovviamente no non vi sono limiti.
Ciao Riccardo non riesco come inserire dei radio bottoni all’interno del js e farli recuperare poi dall’engine potresti darmi una piccola spiegazione se non ti è di troppo disturbo naturalmente grazie mille
nn ho capito da dove si scarica eppure ho condiviso su twitter
Ciao! Sto provando a inserire questo modulo di contatto, ma mi sono imbattuto in un errore: sui campi oggetto e messaggio non viene effettuato nessun controllo, quindi la mail viene spedita correttamente anche se mancano oggetto e messaggio. Da cosa può dipendere?
Grazie
Ciao Riccardo,
grazie dei suggerimenti, ottima guida. Ho un quesito da porti, forse mi puoi aiutare. Su un sito che ho svolto di recente ho creato un form con validazione html5 tipo quello che hai postato tu ma senza checkbox ne capcha e i bot spam riescono ad aggirare lo stesso i required field. Il risultato è che arrivano decine di mail vuote. Come fosso fare?.
Grazie mille!
Ho pubblicato, likeato, ecc. ma non riesco a trovare il bottone download.
Me tapino, me meschino
non si scarica anche io come te, e poi mi è stato cancellato il commento è una bufala io ho risolto diversamente, scaricato un altro script….
peccato, no social no download……
ok, tra tanti questo è uno di quelli che più mi piace.
ci metterei anche un controllo con captcha e sarebbe perfetto 😉
Ciao Riccardo, innanzitutto grazie per il tuo plugin. Mi sembra ottimo. Ho scoperto però una probabile incompatibilità con le librerie jquery. Ho inserito la tua form con le relative librerie in una pagina creata con bootstrap. Bootstrap usa la libreria jquery v. 1.11.1, mentre la tua form carica la libreria v.1.7.2
Il problema è che se tengo la 1.7.2 il pulsante di navigazione collassata (quello che appare in alto a dx quando riduco le dimensioni dello schermo) non funziona, mentre se uso la libreria v.1.11.1 non mi funziona correttamente la form!
Cosa mi suggerisci di fare?
Grazie
Ciao Riccardo non ho più avuto risposta sulla questio della versione di jquery library da usare. Perché il tuo plugin non mi funziona con jQuery v1.11.1?
Grazie è urgente
Elena
Ciao a tutti, ho trovato il problema che ho riscontrato con il funzionamente del form nel mio caso: togliendo dalla forma il checked nel campo della privacy, non mi funziona lo script js perché continua a dirmi che devo spuntare il campo. Se invece lo lascio checked=’checked’ come di default, funziona tutto.
Mi sono persa qualcosa?
Inoltre non riesco a svuotare i campi una volta spedito l’email. Ho guardato le due risposte date qui nel forum ma non mi funzionano lo stesso
Grazie per l’aiuto
Prova a sostituire alla riga 14 di form.js la proprietà attr con prop.
Es: var informativa = $(“#informativa”).prop(‘checked’);
Quindi alla riga 25 cambia informativa != “checked” con informativa != false
Dovrebbe funzionare… spero!
Ciao Riccardo, ho un’altra questione da porti sul tuo script (che peraltro funziona molto bene). Vorrei fare una campagna adwords sul sito dove uso la tua form. Per monitorare la conversione ci sarebbe da inserire un codice javascript nella pagina che indica conversione avvenuta. Ora con la tua form per ora mi appare il messaggio e basta, ma non vado su un’altra pagina di “ringraziamenti” o altro.
Secondo te come posso integrare il codice javascript di Google nella tua form per seguire le conversioni di messaggi spediti?
Grazie!
Ciao come faccio a scaricarlo ho provato con tweeter e fb ma nulla
Ciao, molto bello, ma nonostante il mio “mi piace” non trovo il download… Salutoni…
Ciao Riccardo ottimo plugin. Avrei una domanda: è possibile dopo il send una redirect su di una pagina specifica?
Grazie e buon lavoro!!!
Salve, complimenti per il form!
Avrei una domanda: ho scaricato la versione 2 del form, ho cambiato l’indirizzo email nel file config_email.php (mettendone uno yahoo, poi ho provato anche con uno gmail); ho caricato tutto sul sito ma quando compilo il form on-line, pur dicendomi “e-mail inviata con successo”, non ricevo nessuna email … Potrebbe, gentilmente, illuminarmi sul problema?
Grazie mille,
Francesco
Stesso identico problema, dove sbagliamo?
Complimenti per il form… l’ho usato su un paio di siti e ha sempre funzionato … ora l’ho inserito in un sito nuovo e…non mi funziona più. .perchè? Cioè compilato il form mi dice che l’email è stata inviata con successo ma non mi arriva nulla nella mia casella di posta… come mai? Ti prego rispondimi grazie!!!
Ciao, è possibile fare in modo che la mail inviata al cliente non finisca nello spam ??.
Grazie
Domanda da novellino alle prime armi.. Il form lo si può provare solo una volta inviato le pagine al server? perchè aprendolo dalla cartella sul pc e provando ad inviare una mail prova (dopo configurato ovviamente) mi da errore.
Ciao Riccardo, complimenti per l’articolo davvero molto chiaro.
Io so scrivere in HTML, e il resto per me è a dir poco sconosciuto.
Ti chiedo se questo articolo è l’ultima versione o se c’è un aggiornamento in uscita magari con le modifiche richieste e cioè:
1) aggiunta di un file .JPG (non obbligatorio) da allegare nella mail di ricezione del sito
2) la spunta assente di default sulla parte della privacy (in modo tale che ci sia la volontà da parte dell’utente di accettarla)
3) la cancellazione di tutti i campi compilati dopo aver premuto invio, ed esattamente quando è venuto fuori il messaggio che la comunicazione è stata inviata correttamente
Aggiungo una mia richiesta: è possibile inserire la data da un menù a calendario? Nel mio caso si tratterebbe di prenotare un giorno per effettuare delle prestazioni e il campo deve essere obbligatorio.
Comunque, ancora complimenti per questo contact form!
Dalla pagina html si evince già che il codice è tutto sballato se lascio campi vuoti mi invia lo stesso l’email. Poi troppo codice jquery (non serve) e poi il controllo dell’email si può filtrare da codice php senza passare per java, dato che un utente come hanno detto in tanti potrebbe avere il codice disattivato
Salve complimenti per articoli,
Essendo non esperto vorrei fare in modo che ,chi invia email dopo non può rinviare con la stessa email ,cioè un controllo del email nel db, come dovrei inserire questo controllo.
Saluti
Ciao, volevo aggiungere altri campi, e anche un campo upload, è possibile aggiungerli? tra l’altro ho due form sulla stessa pagina, per non farli andare in conflitto ho cambiato i tag name=”” e anche il file php e js, dovrei aver fatto bene, ma tornando all’upload e gli altri campi è una cosa fattibile?
Ciao Riccardo, il form funziona benissimo, un paio di questioni:
1- le è à ò ì ù, le accentate insomma, compaiono in modo sbagliato tipo “A^”, ho provato a cambiare il tipo di MIME ma non cambia
2- Invece del campo “oggetto” vorrei far immettere un numero di telefono, ho cambiato i parametri ma la mail arriva con “Telefono: undefined”
Che posso fare? Grazie mille
Ciao e grazie per il bel lavoro!
io ho un problema. non apporto alcuna modifica tranne l’inserimento della mail dove inviare il form. Se inserisco la mail che ho su hotmail.it non arriva, se inserisco un’altra mail che ho, legata ad un dominio su register e gestita da Google Mail la mail arriva. come mai? come posso ovviare? Grazie
Ciao e grazie per il tuo tutorial,
l’invio della email funziona bene solo che va a finire sempre nello spam! 🙁
Invio mail puntualmente messe in SPAM
ciao Dario che mail usi per inviare?
Grazie per il tuo post…è possibile implementarlo anche con due campi “date” per fissare una prenotazione come un hotel? Oppure c’è bisogno di altro? Grazie e complimenti.
Ciao Riccardo.
Voglio inserire nel form anche un campo per l’invio del numero telefonico. Ho provato ad inserie il codice seguente, ma non funziona. Mi puoi aiutare?
FORM
JQuery
var telefono = $(“#telefono”).val();
var phoneReg = /^([+]39)?((3[\d]{2})([ ,\-,\/]){0,1}([\d, ]{6,9}))|(((0[\d]{1,4}))([ ,\-,\/]){0,1}([\d, ]{5,10}))$/;
….
else if($(“#telefono”).val().length < 6 || (!phoneReg.test(telefono))) {
$("#bottone").show();
$("”).appendTo(“#contact”).html(“inserisci solo numeri”).delay(2000).fadeOut(duration);
$(“.loader”).hide();
}
….
$.ajax
data: “nome=” + nome + “&email=” + email + “&telefono=” + telefono + “&messaggio=” + messaggio + “&oggetto=” + oggetto + “&informativa=” + informativa,
Ciao Riccardo.
Vorrei inserire nel form un campo per la ricezione di un numero telefonico. Ho fatto in questo modo, ma non funziona. Mi potresti aiutare?
FORM
input type=”text” name=”Telefono” id=”Telefono” placeholder=”il tuo numero di telefono”
validazione Jquery
…
var telefono = $(“#telefono”).val();
var phoneReg = /^((\+|00)?39)?3\d{2}\d{6,7}$/;
…
else if(!phoneReg.test(telefono) || telefono == ”) {
$(“#bottone”).show();
$(“”).appendTo(“#contact”).html(“inserisci un numero di telefono valido”).delay(2000).fadeOut(duration);
$(“.loader”).hide();
}
…
data: “nome=” + nome + “&email=” + email + “&telefono=” + telefono + “&messaggio=” + messaggio + “&informativa=” + informativa,
…
mi sembra tutto corretto, ma non valida nessun numero telefonico.
vedo oggi questa pubblicazione,
se individuo l’indirizzo corretto di “form/engine.php”
sviluppando un breve script php, quante mail ( da burla ) riesco ad inviare usando questo “engine” al giorno ?
anche più di 10.000 …. forse
usare Ajax per questo tipo di attività è un forte attentato alla sicurezza, ne convieni ?
Mettendo gli opportuni controlli e check server side assolutamente no. Ajax è largamente usato ormai da quasi la totalità dei siti in diverse varianti e con diversi framework. La sicurezza non sta nel linguaggio ma nella programmazione. Ovviamente questo articolo è solo un instradamento (tra l’altro fatto molti anni fa ) per chi vuole iniziare 😉
Ottimo script, complimenti.
Sto cercando di implementare una caratteristica.
Ho impostato il form in modo che dopo la compilazione il cliente viene indirizzato ad una pagina (settata nel $grazie) dove visualizza un codice da utilizzare. Vorrei che se lo stesso utente ritorna sulla pagina form.php venga direttamente indirizzato al $grazie senza dover di nuovo compilare il tutto (dovrei affidarmi a qualche sessione o utilizzare l’ip suppongo).
Puoi aiutarmi?