Jquery - attuale valore input text

[foxissimo]

Ciao a tutti,
riscontro un errore molto strano, non riesco a capire...
in una pagina ho il form:

<h3>Scrivici</h3>                            
<hr />                            
<form id="contact-form" method="post" action="funzioni/mail.php">                              
<fieldset>                                
<label class="name">                                    
<input type="text" value="Nome" id="nome" onfocus="if(this.value=='Nome'){this.value=''}" onblur="if(this.value==''){this.value='Nome'}">
</label>                                
<label class="phone">
<input type="text" value="Telefono" id="telefono" onfocus="if(this.value=='Telefono'){this.value=''}" onblur="if(this.value==''){this.value='Telefono'}">
</label>
<label class="email">
<input type="email" value="Email" id="mail" onfocus="if(this.value=='Email'){this.value=''}" onblur="if(this.value==''){this.value='Email'}"> 
</label> 
<label class="message">
<textarea id="messaggio" onfocus="if(this.value=='Messaggio'){this.value=''}" onblur="if(this.value==''){this.value='Messaggio'}">Messaggio</textarea>
</label>
<div class="btns">
<a class="button" onClick="document.getElementById('contact-form').reset()">Rifai</a>                 <a class="button" id="tasto_invia" onClick="manda_mail()">Invia</a>                                 
</div>
</fieldset>
</form>

e questa funzione jquery nell'head del documento:

<script type="text/javascript">
function manda_mail() {
var nome         = $("#nome").val(); 
var telefono     = $("#telefono").val();
var mail         = $("#mail").val();
var messaggio     = $("#messaggio").val();
alert("Nome: " + nome + "\nTelefono: " + telefono + "\nMail: " + mail + "\nMessaggio: " + messaggio + "\n");

}
</script>

che, al clic sul bottone invia, dovrebbe (nelle mie intenzioni) prelevare dai 4 campi del form il valore inserito e crearmi un alert con questi valori.

Purtroppo, anche modificando il valore dei campi prima di premere il bottone "invia", mi ritrovo nell'alert sempre gli stessi valori, e cioè quelli inseriti di default (Nome, Telefono eccecc), come se la funzione andasse a leggere i campi prima della loro modifica.

Qualcuno ha idea?

si può vedere l'errore in esecuzione qua: http://www.yourlifepalestra.it/lab/, nell'ultima scheda Contatti.

ciao e grazie

[foxissimo]

Ciao a tutti,
riscontro un errore molto strano, non riesco a capire...
in una pagina ho il form:

<h3>Scrivici</h3>                            
<hr />                            
<form id="contact-form" method="post" action="funzioni/mail.php">                              
<fieldset>                                
<label class="name">                                    
<input type="text" value="Nome" id="nome" onfocus="if(this.value=='Nome'){this.value=''}" onblur="if(this.value==''){this.value='Nome'}">
</label>                                
<label class="phone">
<input type="text" value="Telefono" id="telefono" onfocus="if(this.value=='Telefono'){this.value=''}" onblur="if(this.value==''){this.value='Telefono'}">
</label>
<label class="email">
<input type="email" value="Email" id="mail" onfocus="if(this.value=='Email'){this.value=''}" onblur="if(this.value==''){this.value='Email'}"> 
</label> 
<label class="message">
<textarea id="messaggio" onfocus="if(this.value=='Messaggio'){this.value=''}" onblur="if(this.value==''){this.value='Messaggio'}">Messaggio</textarea>
</label>
<div class="btns">
<a class="button" onClick="document.getElementById('contact-form').reset()">Rifai</a>
<a class="button" id="tasto_invia" onClick="manda_mail()">Invia</a>                                 
</div>
</fieldset>
</form>

e questa funzione jquery nell'head del documento:

<script type="text/javascript">
function manda_mail() {
var nome         = $("#nome").val(); 
var telefono     = $("#telefono").val();
var mail         = $("#mail").val();
var messaggio     = $("#messaggio").val();
alert("Nome: " + nome + "\nTelefono: " + telefono + "\nMail: " + mail + "\nMessaggio: " + messaggio + "\n");

}
</script>

che, al clic sul bottone invia, dovrebbe (nelle mie intenzioni) prelevare dai 4 campi del form il valore inserito e crearmi un alert con questi valori.

Purtroppo, anche modificando il valore dei campi prima di premere il bottone "invia", mi ritrovo nell'alert sempre gli stessi valori, e cioè quelli inseriti di default (Nome, Telefono eccecc), come se la funzione andasse a leggere i campi prima della loro modifica.

Qualcuno ha idea?

si può vedere l'errore in esecuzione qua: http://www.yourlifepalestra.it/lab/, nell'ultima scheda Contatti.

ciao e grazie

riposto con gli a capo più chiari

[foxissimo]

mmm...no... ho provato con i placeholder al posto di tutta quella pappardella, ma nulla, nemmeno così non funziona.

E nemmeno se provo a fare submit() al form, nulla, le variabili $_POST sone sempre valorizzate con il valore iniziale, o nulle se uso i placeholder...

Ho fatto delle prove... togliendo il javascript di liquidslider (<script src="./js/jquery.liquid-slider.js"></script>
)pare funzionare,

ma come è possibile???

[Enzaccio]

Dunque, intanto per fare i controlli e popolare un alert (che ho sostituito con un confirm), si può anche fare a meno di scomodare JQuery; hai già tutti gli ID assegnati agli Elementi del FORM, quindi:

<script  type="text/javascript">
function manda_mail() {
var d=document;
var nome         = d.getElementById("nome").value; 
var telefono     = d.getElementById("telefono").value;
var mail         = d.getElementById("mail").value;
var messaggio    = d.getElementById("messaggio").value;

var conferma=confirm("Controlla i dati che hai inserito e conferma l'  invio.\n\n" + 
                     "Nome:      " + nome + "\nTelefono: " + telefono +  "\nMail:" + 
                     "         " + mail + "\nMessaggio: " + messaggio +  "\n");
if(conferma==true){
   d.getElementById("contact-form").submit();
}
}
</script>

E nemmeno se provo a fare submit() al form, nulla, le variabili $_POST

Nel mio esempio, il submit viene eseguito sempre tramite JavaScript MA perché le variabili $_POST siano valorizzate, dovrai assegnare anche un NAME ai campi (PHP non rileva gli ID).

Nel tuo caso invece, così come presentato parrebbe che l' invio debba avvenire tramite AJAX (senza abbandonare la pagina); ma non ho intenzione di addentrarmi in tutti quei codici importati ...

[foxissimo]

Nemmeno così funziona...
i campi text e la text area non si comportano come tali, jquery e javascript non riescono a recuperarne i valori, e nemmeno PHP (anche impostando correttamente gli attributi "name") non riesce a valorizzare correttamente le variabili $_POST legare a questo form.

Sono convinto che il problema sia nel javascript di liquid slider, perchè togliendo quello script tutto funziona (però la pagina non si vede più correttamente)...

Devo assolutamente risolvere questa situazione, se qualcuno ha qualche idea ve ne sarei grato...

[foxissimo]

Risolto. il problema era creato da liquidSlider, che ha un opzione che duplica la prima e l'ultima scheda, in modo da permettere la navigazione continua delle schede (dalla prima passare all'ultima e viceversa).

La soluzione è impostare l'opzione di liquidSlider "continuous" a false.

$('#slider').liquidSlider({continuous: false});

come modificare il titolo della discussione, in modo che sia più facilmente individuabile in futuro?