Internet Explorer ajax request not returning anything

Question

At the end of my registration process you get to a payment screen where you can enter a coupon code, and there is an AJAX call which fetches the coupon from the database and returns it to the page so it can be applied to your total before it is submitted to paypal. It works great in Firefox, Chrome, and Safari, but in Internet Explorer, nothing happens. The (data) being returned to the jQuery function appears to be null.

jQuery Post

function applyPromo() {
var enteredCode = $("#promoCode").val();
$(".promoDiscountContainer").css("display", "block");
$(".promoDiscount").html("<img src='/images/loading.gif' alt='Loading...' title='Loading...' height='18' width='18' />");
$.post("/ajax/lookup-promo.php", { promoCode : enteredCode },
   function(data){
        if ( data != "error" ) {
            var promoType = data.getElementsByTagName('promoType').item(0).childNodes.item(0).data;
            var promoAmount = data.getElementsByTagName('promoAmount').item(0).childNodes.item(0).data;
            $(".promoDiscountContainer").css("display", "block");
            $(".totalWithPromoContainer").css("display", "block");
            if (promoType == "percent") {
                $("#promoDiscount").html("-" + promoAmount + "%");
                var newPrice = (originalPrice - (originalPrice * (promoAmount / 100)));
                $("#totalWithPromo").html(" $" + newPrice);
                if ( promoAmount == 100 ) {
                    skipPayment();
                }
            }
            else {
                $("#promoDiscount").html("-$" + promoAmount);
                var newPrice = originalPrice - promoAmount;
                $("#totalWithPromo").html(" $" + newPrice);
            }
            $("#paypalPrice").val(newPrice + ".00");
            $("#promoConfirm").css("display", "none");
            $("#promoConfirm").html("Promotion Found");
            finalPrice = newPrice;
        }
        else {
            $(".promoDiscountContainer").css("display", "none");
            $(".totalWithPromoContainer").css("display", "none");
            $("#promoDiscount").html("");
            $("#totalWithPromo").html("");
            $("#paypalPrice").val(originalPrice + ".00");
            $("#promoConfirm").css("display", "block");
            $("#promoConfirm").html("Promotion Not Found");
            finalPrice = originalPrice;
        }
   }, "xml");

}

Corresponding PHP Page

include '../includes/dbConn.php';

$enteredCode = $_POST['promoCode'];

$result = mysql_query( "SELECT * FROM promotion WHERE promo_code = '" . $enteredCode . "' LIMIT 1");

$currPromo = mysql_fetch_array( $result );

if ( $currPromo ) {
    if ( $currPromo['percent_off'] != "" ) {
        header("content-type:application/xml;charset=utf-8");
        echo "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>";
        echo "<promo>";
        echo "<promoType>percent</promoType>";
        echo "<promoAmount>" . $currPromo['percent_off'] . "</promoAmount>";
        echo "</promo>";
    }
    else if ( $currPromo['fixed_off'] != "") {
        header("content-type:application/xml;charset=utf-8");
        echo "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?>";
        echo "<promo>";
        echo "<promoType>fixed</promoType>";
        echo "<promoAmount>" . $currPromo['fixed_off'] . "</promoAmount>";
        echo "</promo>";
    }
}
else {
    echo "error";
}

When I run the code in IE, I get a javascript error on the Javascript line that says

var promoType = data.getElementsByTagName('promoType').item(0).childNodes.item(0).data;

Here's a screenshot of the IE debugger

Update

I set a breakpoint on the line, and it actually encounters the error on this line:

if ( data != "error" ) {

HOWEVER, when I allow it to run the rest of the code after the breakpoint, it WORKS. I'm thinking that maybe IE is running the callback function before the ajax request is actually finished, so the PHP hasn't returned its results yet? Is there any way I can test that?

Answer 1

Problem solved.

The issue was that the PHP was returning an XML document, and the line data != "error" wasn't valid for an xml document, since an object can't be equal to a string. I changed the php to return XML for all cases, and changed the jQuery to read it differently and now it works beautifully. Thanks everyone for helping me talk it out.