This weekend I built an AJAX debugger which for handling complex types such as objects, arrays, JSON objects etc. The AJAXDebugger traces out all members of a user defined objects, properties of an object, indexes of an array, keys of an array or other object types to a div tag with an id of “console” in your application.
To use it, just include the debugger.js file and create a div somewhere on the page to use as an output panel. Give the div tag an id of “console” as follows:

To use the debugger simply use the following syntax to trace an object to the console div:

Example:
trace (object, true) - whereas the first param is an object of any type to trace and the second param instructs the debugger to recursively trace out the object or not.

Usage Example:
var obj = new Object();
this.obj.name = “AJAX Debugger”;
this.obj.build = 1.0;
this.trace(obj, true);

Outputs the following to the “console” div:
Found instance of type : Object
.name = AJAX Debugger
.build = 1

An upgrade to verison 2.0 will be made within the next few weeks which will allow the console to be in a seperate window abstracted from the application itself.

To view an example of how the debugger works click on the link below:
AJAXDebugger-v1.0/debugger.html

To download version 1.0 of the AJAX Debugger click on the link below:
http://www.ericfeminella.com/utilities/AJAXDebugger.zip

Feel free to email me with your thoughts on the Debugger.

This entry was posted on Monday, May 22nd, 2006 at 9:53 am and is filed under AJAX, News, Utilities. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.