Ajax call not working in Google gadget

Question

I have a conversion rate script which i know works perfectly outside of a Google gadget however i cannot figure out why it doesn't work inside of a gadget.

Here is my XML:

<?xml version="1.0" encoding="UTF-8"?>
<Module>
    <ModulePrefs author="Purefx.co.uk" height="280"></ModulePrefs>
    <UserPref name="title" display_name="Widget Title" default_value="Currency Converter"/>
    <UserPref name="color" display_name="Widget color" default_value="Color" datatype="enum">
        <EnumValue value="Color"/>
        <EnumValue value="Black and White"/>
    </UserPref>
    <UserPref name="style" display_name="Widget Style" default_value="Sidebar" datatype="enum">
        <EnumValue value="Sidebar"/>
        <EnumValue value="header/footer"/>
    </UserPref>
    <UserPref name="attribution" display_name="Attribution text" default_value="Purefx" datatype="enum">
        <EnumValue value="Purefx"/>
        <EnumValue value="Foreign Exchange"/>
        <EnumValue value="Currency exchange"/>
    </UserPref> 
    <Content type="html"><![CDATA[

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {

    $('#convert').click(function(){

     //Get all the values
     var amount = $('#amount').val();
     var from = $('#from').val();
     var to = $('#to').val();

     //Make data string
     var dataString = "amount=" + amount + "&from=" + from + "&to=" + to;

         $.ajax({
           type: "POST",
           url: "ajax_converter.php",
           data: dataString,
           success: function(data){
             //Show results div
             $('#results').show();

            //Put received response into result div
             $('#results').html(data);
           }
         });
    });
});
</script>
]]>
</Content>
</Module>

I haven't included the html part of the content or the php script as that part is 100% working and irrelevant to this problem.

I think the problem is specifically the execution of the Ajax call, on clicking 'convert' nothing is being 'posted' in the firebug console window.

I can't find anything that might suggest i'm missing something so any thoughts are appreciated.

Many thanks in advance

Answer 1

You cannot make direct calls from inside a gadget because a gadget lives inside a gadget container and all calls are proxied by the gadget container.

You must use io.makeRequest to fetch remote data.

More info, see http://code.google.com/apis/gadgets/docs/remote-content.html