AJAX form submission

Question

The following code does not submit the input values:

$('.button').live('click', function()  {
        var date = $('#date', this).val();
        var guests = $('#guests', this).val();

        $('.resLoad').load('/confirmation.php?guests='+guests+'&date='+date);
});

It loads the page in the proper div, but the variables are listed as undefined.

<form class="resConf" action="" method="get">
    <input type="text" name="date" id="date" class="eventname" readonly="readonly" value="1234" /><br class="big" />
    <input type="text" class="eventguest" id="guests" maxlength="2" name="guests" value="" /><br class="big" /> 
    <input type="button" class="button" value="submit" name="submit" />

</form>

Answer 1

$('#date', this)

Is searching for a element with the ID of date, that is a descendent of the button; which is not correct.

$('.button').live('click', function()  {
        var date = $('#date').val();
        var guests = $('#guests').val();

        $('.resLoad').load('/confirmation.php?guests='+guests+'&date='+date);
});

Will work.