Magento One Page Checkout External AJAX Request

Question

I need to be able to receive Shipping information from an external source based on an email address and insert the data into the Shipping Information form.

The ajax request works perfectly well on a blank page, however when I add the code to the one-page-checkout template when the button is clicked the ajax lookup is not initiated, rather the browser acts as if I have clicked on the "continue" button.

I can't get my head around the mix of external and in-line JS in magento so I can't see what is causing this problem.

My external php file returns a json object which is an array which has the following values: [0] - Street 1 - City [2] - Region [3] - Postcode [4] - Country

Please note that I am using the jQuery Ajax Form plugin found here:

In template/checkout/onepage/shipping I have added the following code at about line 38:

<form id="treat-email" action="treatme.php" method="post"> 
    Email: <input type="text" name="treat-email" /> 
    <input type="submit" value="Get Address" /> 
</form>
<script> 
    jQuery(document).ready(function() { 
        jQuery('#treat-email').ajaxForm({
            dataType: 'json',
            success: processJson,
            error: function(){
                alert("You Failed!");
            },
        }); 
    });
    function processJson(data){
        jQuery('#shipping:street1').val(data[0]);
        jQuery('#shipping:city').val(data[1]);
        jQuery('#shipping:region').val(data[2]);
        jQuery('#shipping:postcode').val(data[3]);
        jQuery('#shipping:country').val(data[4]);
    }
</script>

I don't think this is related, but you have an extra comma after the error function. — Amin Eshaq
Oops yes, it makes no difference though as the script works fine out of the context of the one page checkout — Matthew Dolman
are you sure jquery is included and noConflict() is called ? — Anton S

Matthew Dolman Matthew Dolman · Accepted Answer · 2012-03-16T03:05:11

Figured it out myself

I embedded the code inside the actual address form and so clicking the "Get Address" button causes it to submit the main address form.

Magento One Page Checkout External AJAX Request

1 Answers