[Javascript] Conflitto tra più form nella stessa pagina

fabriaqui

Nuovo Utente
11 Apr 2019
8
0
1
Ciao ragazzi, ho un problema non da poco, con PHPMailer ho messo tre form in una pagina ma vanno in conflitto tra loro. Come posso risolvere ?????????

Posto il codice qui sotto.

Sezione html (ometto le altre parti che non riguardano il form)

HTML:
HTML

<form class="form-inline" id="secondo_form" method="post">

<div id="risposta_due" class="error-msg"></div>

<div class="form-group conf-res">
<label>Nome e Cognome</label>
<input type="text" class="form-control" id="nome_cognome_due" name="nome_cognome_due" maxlength="50" spellcheck="false" value="">
</div>

<div class="form-group iata-id">
<label >Telefono</label>
<input type="text" class="form-control iata-input" id="telefono_ass" name="telefono_ass" maxlength="20" value="">
</div>

<div class="view-res" id="invia_due">Invia</div>

<input type="checkbox" id="spunta_due" name="spunta_due" value="B">
</form>


<form class="form-inline" id="terzo_form" method="post">

<div id="risposta_tre" class="error-msg"></div>

<div class="form-group conf-res">
<label>Nome e Cognome</label>
<input type="text" class="form-control" id="nome_cognome_tre" name="nome_cognome_tre" maxlength="50" spellcheck="false" value="">
</div>

<div class="form-group iata-id">
<label >Telefono</label>
<input type="text" class="form-control iata-input" id="telefono_ass_due" name="telefono_ass_due" maxlength="20" value="">
</div>

<div class="view-res" id="invia_tre">Invia</div>

<input type="checkbox" id="spunta_tre" name="spunta_tre" value="B">
</form>


<script src="/js/jquery.min.js"></script>
<script src="/js/jquery_mailer_due.js"></script>
<script src="/js/jquery_mailer_tre.js"></script>

/HTML


File javascript (sono due librerie distinte, file due e file tre)

Codice:
javascript "jquery_mailer_due.js"



$(document).ready(function(){
$("#invia_due").click(function(){
 
//Recuperiamo tutte le variabili

var valid = '';
var isr = ' manca. </h10>';
var nome_cognome_due = $("#nome_cognome_due").val();
var telefono_ass = $("#telefono_ass").val();
var checkbox_due = $("#checkbox_due").val();


//Eseguiamo una serie di controlli

if (nome_cognome_due.length<1) {
valid += 'Il nominativo'+isr;
}

if (telefono_ass.length<1) {
valid += 'Il telefono'+isr;
}

if ($("#checkbox_due").is(":not(:checked)")){
valid += '<h10>La spunta sulla privacy'+isr;
}


//Se i controlli dei campi form non vengono superati, appare il messaggio di errore.

if (valid!='') {
$("#risposta_due").fadeIn("slow");
$("#risposta_due").html("<b>Errore: </b><br/>"+valid);
$("#risposta_due").css("background-color","#FFFFE5");
}

//Se i controlli vengono superati, compare un messaggio di invio in corso
else {
var datastr ='nome_cognome_due=' + nome_cognome_due + '&telefono_ass=' + telefono_ass;
$("#risposta_due").css("display", "block");
$("#risposta_due").css("background-color","#FFFFE5");
$("#risposta_due").html("<h10>Invio del messaggio in corso..</h10>");
$("#risposta_due").fadeIn("slow");
setTimeout("send('"+datastr+"')",2000);
}

return false;
});
});

//Creazione della funzione di invio. Si baserà sul nostro file php.
//var datastr ='name=' + name + '&mail=' + mail +'&messaggio=' + encodeURIComponent(messaggio);.

function send(datastr){
$.ajax({  
type: "POST",
url: "invio_mail2.php",
data: datastr,
cache: false,
success: function(html){
$("#risposta_due").fadeIn("slow");
$("#risposta_due").html(html);
$("#risposta_due").css("background-color","#FFFFE5");
setTimeout('$("#risposta_due").fadeOut("slow")',2000);
}
});
}





javascript "jquery_mailer_tre.js"



$(document).ready(function(){
$("#invia_tre").click(function(){
 
//Recuperiamo tutte le variabili

var valid = '';
var isr = ' manca. </h10>';
var nome_cognome_tre = $("#nome_cognome_tre").val();
var telefono_ass_due = $("#telefono_ass_due").val();
var checkbox_due = $("#checkbox_due").val();


//Eseguiamo una serie di controlli

if (nome_cognome_tre.length<1) {
valid += 'Il nominativo'+isr;
}

if (telefono_ass_due.length<1) {
valid += 'Il telefono'+isr;
}

if ($("#checkbox_tre").is(":not(:checked)")){
valid += '<h10>La spunta sulla privacy'+isr;
}


//Se i controlli dei campi form non vengono superati, appare il messaggio di errore.

if (valid!='') {
$("#risposta_tre").fadeIn("slow");
$("#risposta_tre").html("<b>Errore: </b><br/>"+valid);
$("#risposta_tre").css("background-color","#FFFFE5");
}

//Se i controlli vengono superati, compare un messaggio di invio in corso
else {
var datastr ='nome_cognome_tre=' + nome_cognome_tre + '&telefono_ass_due=' + telefono_ass_due;
$("#risposta_tre").css("display", "block");
$("#risposta_tre").css("background-color","#FFFFE5");
$("#risposta_tre").html("<h10>Invio del messaggio in corso..</h10>");
$("#risposta_tre").fadeIn("slow");
setTimeout("send('"+datastr+"')",2000);
}

return false;
});
});

//Creazione della funzione di invio. Si baserà sul nostro file php.
//var datastr ='name=' + name + '&mail=' + mail +'&messaggio=' + encodeURIComponent(messaggio);.

function send(datastr){
$.ajax({  
type: "POST",
url: "invio_mail3.php",
data: datastr,
cache: false,
success: function(html){
$("#risposta_tre").fadeIn("slow");
$("#risposta_tre").html(html);
$("#risposta_tre").css("background-color","#FFFFE5");
setTimeout('$("#risposta_tre").fadeOut("slow")',2000);
}
});
}

Codice PHP (stesso discorso dei javascript, sono due file divisi)

PHP:
PHP - invio_mail2.php


<?php

header('Content-type: text/html; charset=utf8');
echo '<meta http-equiv="Content-Type" content="text/html; charset=utf8" />';

$data = date("j F Y G:i");
$tome = "xxxxxxxxxxx";
$soggetto = "Messaggio";
$nome_cognome_due = $_POST['nome_cognome_due'];
$telefono_ass = $_POST['telefono_ass'];
$ip = $_SERVER['REMOTE_ADDR'];


require("phpemail/class.phpmailer.php");

$mail = new PHPMailer();

$mail->IsSMTP();  // telling the class to use SMTP


$mail->SMTPAuth = true; // turn on SMTP authentication
$mail->Host       = "xxxxxxxxxxx"; // sets GMAIL as the SMTP server
$mail->Port       = 587;                   // set the SMTP port for the GMAIL

$mail->Username = "xxxxxxxxxxx"; // SMTP username
$mail->Password = "xxxxxxxxxx"; // SMTP password


$mail->From     = "xxxxxxxxxxxxx";
$mail->FromName = "xxxxxxxxxxxxx";
$mail->AddBCC("$tome");


$mail->WordWrap = 50;

$mail->IsHTML(true); // send as HTML

$mail->Subject  = "Richiesta di assistenza";
$mail->Body .= "<br>";
$mail->Body     .= ("<img src=/img/logo_in_nero.png>") ;
$mail->Body .= "<br>";
$mail->Body .= "<br>";
$mail->Body .= "<strong>Richiesta</strong>";
$mail->Body .= "<br>";
$mail->Body .= "<br><strong>Effettuata il:</strong> $data";
$mail->Body .= "<br>";
$mail->Body .= "<br><strong>Da parte di:</strong> $_POST[nome_cognome_due]";
$mail->Body .= "<br>";
$mail->Body .= "<br><strong>Numero di telefono:</strong> $telefono_ass";



//Se l'e-mail viene spedita correttamente, compare un messaggio di avvenuto invio

if(!$mail->Send()) {
  echo 'Il messaggio NON è stato inviato!<br/>';
  echo 'Mailer error: ' . $mail->ErrorInfo;
} else {
  echo '<p>Messaggio INVIATO Grazie.</p>';
}
?>




PHP - invio_mail3.ph



<?php

header('Content-type: text/html; charset=utf8');
echo '<meta http-equiv="Content-Type" content="text/html; charset=utf8" />';

$data = date("j F Y G:i");
$tome = "xxxxxxxxxxx";
$soggetto = "Messaggio";
$nome_cognome_tre = $_POST['nome_cognome_tre'];
$telefono_ass_due = $_POST['telefono_ass_due'];
$ip = $_SERVER['REMOTE_ADDR'];


require("phpemail/class.phpmailer.php");

$mail = new PHPMailer();

$mail->IsSMTP();  // telling the class to use SMTP


$mail->SMTPAuth = true; // turn on SMTP authentication
$mail->Host       = "xxxxxxxxxxx"; // sets GMAIL as the SMTP server
$mail->Port       = 587;                   // set the SMTP port for the GMAIL

$mail->Username = "xxxxxxxxxxx"; // SMTP username
$mail->Password = "xxxxxxxxxx"; // SMTP password


$mail->From     = "xxxxxxxxxxxxx";
$mail->FromName = "xxxxxxxxxxxxx";
$mail->AddBCC("$tome");


$mail->WordWrap = 50;

$mail->IsHTML(true); // send as HTML

$mail->Subject  = "Richiesta di contatto";
$mail->Body .= "<br>";
$mail->Body     .= ("<img src=/img/logo_in_nero.png>") ;
$mail->Body .= "<br>";
$mail->Body .= "<br>";
$mail->Body .= "<strong>Richiesta</strong>";
$mail->Body .= "<br>";
$mail->Body .= "<br><strong>Effettuata il:</strong> $data";
$mail->Body .= "<br>";
$mail->Body .= "<br><strong>Da parte di:</strong> $_POST[nome_cognome_tre]";
$mail->Body .= "<br>";
$mail->Body .= "<br><strong>Numero di telefono:</strong> $telefono_ass_due";



//Se l'e-mail viene spedita correttamente, compare un messaggio di avvenuto invio

if(!$mail->Send()) {
  echo 'Il messaggio NON è stato inviato!<br/>';
  echo 'Mailer error: ' . $mail->ErrorInfo;
} else {
  echo '<p>Messaggio INVIATO Grazie.</p>';
}
?>

Manca il terzo form che ha molte più voci ma è basato su un identico meccanismo. Non scervellatevi a verificare che i name o gli id siano corretti perchè l'ho già fatto mille volte.

Non so come ne perchè ma i form ed i relativi file si intrecciano tra loro.
Evidentemente manca un sistema che una volta iniziato a compilare un form automaticamente venga detto di escludere gli altri due. Evidentemente PHPMailer non è stato pensato per mettere più form nella stessa pagina.
 
Ultima modifica di un moderatore:

marino51

Utente Attivo
28 Feb 2013
3.035
192
63
Lombardia
ho ripreso il tuo script ed ho lavorato sul form 2, arrivando ad un risultato positivo
nell'originale ci sono alcuni errori,
nomi di campi errati,
ajax con metodo POST ma la stringa dei dati formattata (forse) come GET

consiglio, guarda lo script che ti posto (alla base é il tuo), ma cerca di cogliere le particolarità che ti permettono di semplificare il "muliform", soprattutto condividendo i campi comuni tra i form

ho lasciato degli alert che aiutano a capire, a necessità puoi aggiungerne altri

poi se ti serve ancora supporto, fatti vivo

HTML:
<html>
<head>
  <title>multiform</title>

  <script type='text/javascript' src='http://localhost/test_site/php/jquery.min.js'></script>

  <script>
$(document).ready(function(){
  $("#invia_due").click(function(){

alert('DUE - CI SONO !');

    var valid            = '';
    var isr              = ' manca. </h10>';

    var nome_cognome_due = $('#nome_cognome_due').val();
    var telefono_ass     = $('#telefono_ass').val();
    var checkbox_due     = $('#spunta_due:checked').val()?true:false;
    var formNumber       = $('#formNumber').val();

alert('nome_cognome_due '+nome_cognome_due+'\r\ntelefono_ass '+telefono_ass+'\r\ncheckbox_due '+checkbox_due+'\r\nformNumber '+formNumber);

    if (nome_cognome_due.length<1) {
      valid += 'Il nominativo'+isr;
    }

    if (telefono_ass.length<1) {
      valid += 'Il telefono'+isr;
    }

    if (checkbox_due == false){
      valid += '<h10>La spunta sulla privacy'+isr;
    }

    if (valid != '') {
      $("#risposta_due").fadeIn("slow");
      $("#risposta_due").html("<b>Errore: </b><br/>"+valid);
      $("#risposta_due").css("background-color","#FFFFE5");
    }
    else {
      var datastr =
          {
            nome_cognome_due : nome_cognome_due,
            telefono_ass     : telefono_ass,
            checkbox_due     : checkbox_due,
            formNumber       : formNumber,
          };

      $("#risposta_due").css("display", "block");
      $("#risposta_due").css("background-color","#FFFFE5");
      $("#risposta_due").html("<h10>Invio del messaggio in corso..</h10>");
      $("#risposta_due").fadeIn("slow");

      setTimeout(send2(datastr),2000);
    }
    return false;
  });
});

function send2(datastr){
  $.ajax({  
    type    : "POST",
    url     : "invio_mail2.php",
    data    : datastr,
    cache   : false,
    success : function(html){
      $("#risposta_due").fadeIn("slow");
      $("#risposta_due").html(html);
      $("#risposta_due").css("background-color","#FFFFE5");
      setTimeout('$("#risposta_due").fadeOut("slow")',5000);
    },
    error: function(errore){
      alert('ERRORE : il server non risponde o lo ha fatto in modo anomalo '+errore);
    }
  });
}
  </script>

  <script>
$(document).ready(function(){
  $("#invia_tre").click(function(){

alert('TRE - CI SONO !');

  });
});
  </script>
</head>
<body>

<form class="form-inline" id="secondo_form" method="post">

  <div id="risposta_due" class="error-msg"></div>

  <div class="form-group conf-res">
    <label>Nome e Cognome</label>
    <input type="text" class="form-control" id="nome_cognome_due" name="nome_cognome_due" maxlength="50" spellcheck="false" value="">
  </div>

  <div class="form-group iata-id">
    <label >Telefono</label>
    <input type="text" class="form-control iata-input" id="telefono_ass" name="telefono_ass" maxlength="20" value="">
  </div>

  <input type="checkbox" id="spunta_due" name="spunta_due" value="B">

  <input type="hidden" id="formNumber" name="formNumber" value="2" />

  <br />
  <div class="view-res" id="invia_due">Invia</div>

</form>


<form class="form-inline" id="terzo_form" method="post">

  <div id="risposta_tre" class="error-msg"></div>

  <input type="hidden" id="formNumber" name="formNumber" value="3" />

</form>

</body>
</html>

PHP:
<?php
require_once 'myUtils/show_vars.php';

echo "<h3>POST</h3>".show_var($_POST)."<br /><br />";

extract($_POST, EXTR_OVERWRITE);

echo "<h3>Lista di tutte le variabili definite</h3>".show_var(get_defined_vars())."<br /><br />";
?>

risultato
upload_2019-4-13_22-25-55.png
 
Ultima modifica:
Discussioni simili
Autore Titolo Forum Risposte Data
N conflitto tra diversi javascript mootools e qscroller Javascript 4
O [Javascript] Conflitto Jquery: forse... Javascript 0
S Problemi Javascript + Aruba Javascript 2
M Inviare un file su un server remoto con JavaScript Javascript 0
T a href="javascript:;" Javascript 0
F Creare elementi html con javascript Javascript 2
A pulsante di update campo mysql con javascript Javascript 2
8 Javascript - PDF Form Javascript 0
B javascript per problemi con pdf e Safari Javascript 0
N informazione javascript Programmazione 0
I Eecuzione di javascript in ciclo foreach php. PHP 7
P javascript:document.forms Javascript 7
S Consiglio esercizio Javascript Javascript 2
MarcoGrazia Aggiungere o rimuovere classi in javascript Javascript 1
P Passaggio id php a javascript PHP 6
E lettura da un Database con Javascript jQuery 2
V TRIS in javascript Javascript 1
IClaude Funzione Javascript Javascript 8
Alex_70 Javascript date color Javascript 3
F Convertire JavaScript per la compatibilità nei browser obsoleti Javascript 0
I Passare dei parametri in javascript PHP 0
Shyson Meglio Javascript o HTML? Javascript 4
M Chiamare pagina php da javascript Javascript 8
M Errore JavaScript per php [objeto HTMLParagraphElement] PHP 0
D Javascript per il download dei dati Javascript 0
grgfede Problema javascript con aruba Javascript 1
webmachine [PHP] [JAVASCRIPT] Form strano in HTML PHP PHP 1
W Modificare il Type di un Input box in javascript ovunque si trovi Javascript 0
I javascript come caricare una pagina sopra quella corrente in automatico Javascript 2
L [Javascript] Problema salvataggio dati in db Javascript 1
max1974 [Javascript] Grafico chartjs con dati da J.ajax Javascript 3
G Quiz Javascript Javascript 4
A [Javascript] Scrittura su più campi contemporaneamente Javascript 19
F classic asp popolare combo box javascript Presentati al Forum 1
claudio_lorenzo [Javascript] aiuto su jquery per calcolo altezze dom Javascript 1
F [Javascript] comando innerHTML non funziona Javascript 5
alexice51 proggrammi per scrivere in javascript? Javascript 3
max1974 [Javascript] Accordion aria-exspanded Javascript 0
D [Javascript] salvare immagine canvas - paypal Javascript 0
M [Javascript] Canvas js css Javascript 1
M Programmazione web HTML, CSS e JavaScript Offerte e Richieste di Lavoro e/o Collaborazione 6
G [Javascript] Errore inserimento dati Backend Node.js e workbench Javascript 1
A Creare con Javascript un percorso all'interno di uno spazio Javascript 0
D [Javascript] inserire uno script in un file php Javascript 6
Monital [Javascript] inserire dati estratti dal db in html fisso Javascript 1
K [javascript] Tecnica per rilevare celle contenenti caratteri ricevute in dinamico Javascript 1
F [JavaScript] Ottenere il CSS dopo transform: scale() e transform-origin Javascript 0
S [Javascript] Problema costrutto if Javascript 0
I [Javascript] window.location.href porta alla nuova pagina e ritorna incomprensibilmente. Javascript 0
L [Javascript] input variabili di scrittura con canvas Javascript 2

Discussioni simili