Come utilizzare jQuery $ .post() per presentare il modulo valori

Question

Ho 1 pagina principale con una forma e un'altra pagina per elaborare il valore di modulo qui sono i codici sorgente delle pagine 2

modulo della pagina:

<meta charset="UTF-8"> 
<title>Form Page</title> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<form action="process.php" method="post" id="reg-form"> 
     Username: <input type="text" id="username" name="username"> 
     <br> 
     Password: <input type="password" id="password" name="password"> 
     <br> 
     <button type="submit" id="submit-btn">Traditional Submit</button> 
     <button type="button" id="post-btn">$.Post Submit</button> 
</form> 
<script> 
    $("#post-btn").click(function(){   
     $.post("process.php",function(data){ 
      alert(data); 
     }); 
    }); 
</script> 

processo Pagina:

<?php 
$username=$_POST["username"]; 
$password=$_POST["password"]; 
echo "Username: ".$username; 
echo "<br>"; 
echo "Password: ".$password;?> 

se scatto il "tradizionale Invia "buttton, funziona perfettamente.

ma quando clicco sul "$ .Pubblicare Invia" pulsante, ho appena continuo a ricevere errore msg "Avviso: Indice non definito ..."

io non riesco a capire dove sia il problema, aiuto gentile di controllo e aggiusta, grazie in anticipo!

Answer 1

È necessario selezionare e inviare i dati del modulo così:

$("#post-btn").click(function(){   
    $.post("process.php", $("#reg-form").serialize(), function(data) { 
     alert(data); 
    }); 
}); 

Date un'occhiata alla documentazione per il metodo di jQuery serialize, che codifica i dati dai campi di modulo in un stringa di dati da inviare al server.

Answer 2

Ottieni il valore delle tue caselle di testo utilizzando val() e memorizzale in una variabile. Passa questi valori attraverso $.post. Nell'utilizzo di $.Post Submit button è possibile rimuovere il modulo.

<script> 

    username = $("#username").val(); 
    password = $("#password").val(); 

    $("#post-btn").click(function(){   
     $.post("process.php", { username:username, password:password } ,function(data){ 
      alert(data); 
     }); 
    }); 
</script> 

Answer 3

Yor $.post non ha dati. Devi passare i dati del modulo. È possibile utilizzare serialize() per pubblicare i dati del modulo. Prova questo

$("#post-btn").click(function(){ 
    $.post("process.php", $('#reg-form').serialize() ,function(data){ 
     alert(data); 
    }); 
});