jQuery get form data on submit

http://stackoverflow.com/questions/28181175

by Alex Azuero

HTML

<form name='confirm_appointment' method='post' class='confirm_appointment'>
    <input type='text' name="hello" value='hello' />
    <input type='text' name="hi" value='hi' />
    <input type='submit' class='update_appointment_button' value='submit' />
</form>

<form name='confirm_appointment_2' method='post' class='confirm_appointment'>
    <input type='text' name="hello" value='hello_2' />
    <input type='text' name="hi" value='hi_2' />
    <input type='submit' class='update_appointment_button' value='submit' />
</form>

CSS

form {
    
    width: 400px;
    padding: 10px;
    margin: 10px;
    border: 1px solid grey;
    line-height: 20px;
}

JavaScript

$('.confirm_appointment').submit(function(e) {
    
    e.preventDefault();
    
    // $(this).serialize(); will be the serialized form
    $(this).append($(this).serialize() + '<br />');
});