CODEWITHSUNDEEP
jqueryxmlxml-parsing
PaperChase
PaperChase

Reputation: 1585

Read XML file with jQuery

I have an xml file in the form:

<cart>
<itemCount>1</itemCount>
<cartTotal>33.94</cartTotal>
</cart>

This is to track what is in the contents of an ecommerce shopping cart. So it will always only have one "cart" node.

I want to read the "cartTotal" field. If it is greater than 0, then I want to display my "View cart" button on the website.

I've tried the following and it isn't working:

$(document).ready(function(){
    $.ajax({
        type: "GET",
        url: "https://www.example.com/file.xml",
        dataType: "xml",
        success: function(xml) {
            $(xml).find('cart').each(function(){
                if (($(this).attr('cartTotal')) > 0) {
                    $("a.view-cart-button").css('visibility', 'visible');
                }
            });
        }
    });
});

Upvotes: 0

Views: 16850

Answers (1)

Luke Stevenson
Luke Stevenson

Reputation: 10351

The elements within <cart>...</cart> are not attributes but child nodes.

Replace:

if (($(this).attr('cartTotal')) > 0) {
    $("a.view-cart-button").css('visibility', 'visible');
}

With:

if ( $('cartTotal',$(this)).text()*1 > 0) {
    $("a.view-cart-button").css('visibility', 'visible');
}

AMENDMENT

With the caveat that calling XML files, using AJAX, on another domain and without CORS access in place, this will fail, try the following:

$(document).ready(function(){

    $.ajax({
        type: "GET" ,
        url: "https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=xml" ,
        dataType: "xml" ,
        success: function(xml) {
            if( $(xml).find('cartTotal').text()*1 > 0 ){
                $("a.view-cart-button").css('visibility', 'visible');
            }
        }
    });

});​

If you are dealing with a payment gateway, or similar, refer to their documentation first - they will specify how you can interact with them from your own site.

Upvotes: 1

Related Questions