使用JQuery更新表

Question

I am using jQuery to create a table of prices and dates. After some trials and tribulations this is now working well. To further improve it, I want to offer site visitors the possibility of displaying the prices in other currencies. So I need to update the table with most of the data the same, changing only the currency.

The table is initially loaded with this code

function Dates(getresult){
         $.ajax ({
            type: 'post',
            url: '/includes/calendar_price_currency.php',
            data: $("#StartDateCal").serialize(),
            success: function(result) {
             $("#pricePickerResult").html(result);
            }
        });
    }

// Auto load ajax
Dates('getresult');

This takes hidden inputs in the StartDateCal div (including the name of the currency) and runs it through the calendar_price_currency.php file. The result is displayed in the pricePickerResult div.

Just below that div I have added buttons to change the currency. At the moment I have this code to update the table

// Euro currency Link load ajax
$('a#euro').click(function () {
         $.ajax ({
            type: 'post',
            url: '/includes/calendar_price_currency.php',
            data: $("#StartDateCal").serialize(),
            data: {'currency': 'EUR'},
            success: function(result) {
             $("#pricePickerResult").html(result);
            }
        });
    return false;
});

but it doesn't work! Clicking the link reloads the table, but with no content. I presume I am doing something wrong with the "data" lines, but I don't know what. I've tried removing the second line and then nothing visibly happens but I assume the table is reloading with the same data, so there is nothing to see.

Effectively I need most of the data to remain the same and just the currency to change. I had hoped that my second data line would just overwrite the currency element, but it looks like it overwrites everything. Is there a way of mixing "serialize" with another way of loading data?

EDIT

I found a bit of extra info here, and then changed my script to this:

$('a#euro').click(function () {
    var data = $('#StartDateCal').serializeArray();
    data.push({name: 'currency', value: 'EUR'});
    $.ajax ({
            type: 'post',
            url: '/includes/calendar_price_currency.php',
            data: data,
            success: function(result) {
            $("#pricePickerResult").html(result);
            }
        });
    return false;


   });

Answer 1

You have two data values that you're sending

data: $("#StartDateCal").serialize(),
data: {'currency': 'EUR'},

Remove one.