jQuery ajax对话框不断发送相同的值

Question

It seems i'm having a problem with a jQuery ajax form, it keeps sending the same value although the form fields appear to be empty. Therefore i assume jQuery is "caching" or not overwriting the vars i defined.

function payment(projectID, billID)
{
    $.ajax
    ({
        url: 'modules/projects/projectFinancial.php?action=paymentDetails&projectID=' + projectID + '&billID=' + billID + '&rand=' + Math.random(),
        dataType: 'html',
        async: false,
        success: function(msg)
        {
            $("#paymentDetails").html(msg);
        }
    });

    $("#payment").dialog(
    {
        width: 500,
        height: 300,
        modal: true,
        buttons: 
        {
            Save: function()
            {
                var paymentAmount = $("#PaymentAmount").val();
                var paymentMethod = $("#PaymentMethod").val();
                var paymentRemarks = $("#PaymentRemarks").val();

                if ($('#PaymentDone').is(':checked'))
                {
                    var paymentDone = 1;
                }
                else
                {
                    var paymentDone = 0;
                }

                $.ajax
                ({
                    url: 'modules/projects/projectFinancial.php?action=payment&projectID=' + projectID + '&billID=' + billID + '&paymentAmount=' + paymentAmount + '&paymentMethod=' + paymentMethod + '&paymentRemarks=' + paymentRemarks + '&paymentDone=' + paymentDone + '&rand=' + Math.random(),
                    dataType: 'html',
                    async: false,
                    success: function(msg)
                    {
                        if (msg != "error")
                        {
                            showFinancial(msg, '{/literal}{$marginCalculated}{literal}');
                        }
                    }
                });

                $(this).dialog("close");
            }
        }
    });
}

Answer 1

Try turning off caching entirely using the code below. Also, you should use POST method for actions that alter something on the server (payment seems such an action).

$(function() {
    $.ajaxSetup({ cache: false });
});

Another thought: make sure that upon clicking Save for the second time, #PaymentAmount refers to the input field in the second dialog box. Using IDs in dynamically-loaded content is risky because you can easily end up with duplicate IDs if you load the same thing more than once.

$(this).dialog("close") doesn't actually remove the old dialog from the DOM.
Try using $(this).dialog("destroy") instead.