user547794 user547794 - 3 months ago 9
jQuery Question

jQuery - Getting form values for ajax POST

I am trying to post form values via AJAX to a php file. How do I collect my form values to send inside of the "data" parameter?

$.ajax({
type: "POST",
data: "submit=1&username="+username+"&email="+email+"&password="+password+"&passconf="+passconf,
url: "http://rt.ja.com/includes/register.php",
success: function(data)
{
//alert(data);
$('#userError').html(data);
$("#userError").html(userChar);
$("#userError").html(userTaken);


}
});


HTML:

<div id="border">
<form action="/" id="registerSubmit">
<div id="userError"></div>
Username: <input type="text" name="username" id="username" size="10"/><br>
<div id="emailError" ></div>
Email: <input type="text" name="email" size="10" id="email"/><br>
<div id="passError" ></div>
Password: <input type="password" name="password" size="10" id="password"/><br>
<div id="passConfError" ></div>
Confirm Password: <input type="password" name="passconf" size="10" id="passconf"/><br>
<input type="submit" name="submit" value="Register" />

</form>
</div>

Answer

Use the serialize method:

$.ajax({
    ...
    data: $("#registerSubmit").serialize(),
    ...
})

Docs: serialize()

Comments