How can i debug this ajax script for IE?

Question

I have and an AJAX script in a page that works just fine with no bugs in firefoex, but IE6 loads the page with an ugly error icon on the status bar. What is the best way i can go about fixing/debugging this?

Here is the error report:

I have checked line 323 many times Here is the function:

function checkAvailability(){

   var card_select  = document.getElementById('card_select').value;
   var price_select = document.getElementById('price_select').value;
   var num_of_cards = document.getElementById('num_of_cards').value;
   var url = 'checkAvailability.php?cardName=' + card_select + '&value=' + price_select + '&amount=' + num_of_cards;

   var xmlhttp;
            if (window.XMLHttpRequest)
            {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }
            else if (window.ActiveXObject)
            {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            else
            {
                alert("Your browser does not support XMLHTTP!");
            }

            xmlhttp.onreadystatechange =    function()
                                            {
                                                if(xmlhttp.readyState == 4 && xmlhttp.responseText) /**** line 323 ****/
                                                {
                                                    document.getElementById('submit_button').className      = 'hidden';
                                                    document.getElementById('div_error_massage').className  = 'anounce_div';
                                                    document.getElementById('error_massage').innerHTML      = xmlhttp.responseText;
                                                    document.getElementById('num_of_cards').className       = 'red_inputs';
                                                }
                                                else if(isNaN(num_of_cards))
                                                {
                                                    document.getElementById('submit_button').className      = 'hidden';
                                                    document.getElementById('num_of_cards').className       = 'red_inputs';
                                                    document.getElementById('div_error_massage').className  = 'hidden';

                                                }
                                                else if(num_of_cards != "" && !xmlhttp.responseText) 
                                                {
                                                    document.getElementById('submit_button').className      = '';
                                                    document.getElementById('error_massage').innerHTML      = 'Total: $' + document.getElementById('price_select').value * document.getElementById('num_of_cards').value  + '.00';
                                                    document.getElementById('div_error_massage').className  = 'anounce_div';

                                                }
                                                else
                                                {
                                                    document.getElementById('submit_button').className      = 'hidden';
                                                    document.getElementById('num_of_cards').className       = 'red_inputs';
                                                }
                                            }




            xmlhttp.open("GET",url,true);
            xmlhttp.send(null);

}

Answer 1

In IE, you can try the old script debugger or Visual Web Developer Express . When the error throws, enter the debugger and examine xmlhttp .

Answer 2

In addition to outis' answer, if you want to control where you jump in with the debugger, use Javascript's debugger keyword, which acts like a breakpoint. When the line with debugger; is hit, in IE you will get a prompt (if debugging is enabled in IE, check your Internet Options) to launch the debugger, starting at that line. In Firefox, the debugger; statement is picked up by Firebug as a breakpoint.

Answer 3

You are trying to read !xmlhttp.responseText when the readyState is not 4

Try removing that line and see if IE runs.

Answer 4

A great Javascript debugger for IE comes with MS Office.

A quick google shows this as a howto: http://www.jonathanboutelle.com/mt/archives/2006/01/howto_debug_jav.html