Tips for Debugging Ajax Applications - Part2


1. Use Javascript alerts to indicate the values of variables.
There are three families of values you'll need to confirm:

  • Values received by a function:
    Use this for any Javascript function, like the one triggered by the HTML event or the one called when the PHP script returns its value.

  • Values returned by the PHP script:
    Since responseText stores the data you'll deal with in the Javascript, confirming its value is a great debugging technique.

  • Values to be assigned to HTML elements:
    You could also have problems in writing new HTML to the web page.In such cases, you'll need to confirm if the problem is in the message being written (tested using such a alert) or in the writing process itself(i.e., assigning a value to innerHTML).

2. Make sure you reload your Web browser after making changes. Failure to do so in common, and very frustrating, mistake.

3. Test with multiple browsers. With Javascript and HTML, different browsers can behave differently, so see how your applications behave in multiple browsers.

4. Watch the method --GET or POST-- being used. Some browsers (I'm looking at you Internet Explorer) cache GET page requests, so it might look as if the changes you made didn't take effort.

5. Use a Javascript console. Good browsers, like Firefox and Safari, can show Javascript errors in a separate window.

6. Use a Javascript debugger. Firefox users benefit greatly from the Venkman debugger(www.mozilla.org/projects/venkman). Internet Explorer users have the Microsoft Script Debugger.