Figure 1: Class Diagram
The main entry point of the logging system is the
ExceptionManager class - a Singleton object. We will use the
PublishException method of this class to log our exceptions. The
ExceptionManager holds a list of trace listeners to which it delegates the call. We can add/remove listeners by calling the
RemoveListener methods of this class. To create a new listener, all we have to do is create a new class- which inherits from
BaseTraceListener- that we will examine in the Extensibility section of this article.
Now let us explore the usage part. First, you have to add the
Ajax.Logging.ExceptionManager.js file in the
ScriptManager of your page like the following:
Next, add a
script tag after the
ScriptManager and add your preferred listeners in the Sys.Application load event, like the following.
Now we are all set to log our exception. Let's look at a few quick examples of logging.
Listing 3: Logging Regular Exception
Listing 4: Logging ASP.NET AJAX Exception
Listing 5: Logging Web Service Exception
Listing 6: Logging Update Panel Exception
Listing 7: Logging Unhandled Exception
As mentioned before, this is the main entry point of the logging system. It holds a list of listeners which it delegates the
PublishException calls. Before delegating, it calls a helper method called
GetEnviornmentInfo to gather various info such as the current url, a list of
script tags with external source files, referrer, which are passed to individual listeners. The following listing shows the code for the
Error or a
This is an abstract class from which all other trace listeners inherit from. It expects a line separator as a parameter (The default value is
'\n') in its constructor. It also contains a helper method called
FormatException that the other listeners call.
It uses the Sys.Debug.traceDump method of the Microsoft Ajax Library to log the exception. Therefore, you must declare in the page a textarea element whose id is set to
TraceConsole to allow this listener to work. Note that this listener will not work if the debug mode of the website in the web.config file is set to
false. The following figure shows a screenshot of this listener in action.
Figure 2: SysDebugTraceListener in action
This listener shows a message box with the error details. It shows more details comparing to the partial page rendering error box. The following figure shows a screenshot of this listener in action.
Figure 3: AlertTraceListener in action
This is similar to
SysDebugTraceListener, but it writes the exception in an HTML
div tag instead of a predefined element. The constructor of this class expects a
div element or the id of that
Figure 4: DivTraceListener in action
In this section, I will show you how to create a custom trace listener using the Ajax Control Toolkit's Modal Popup to show the Error. If you are new to Modal Popup, I recommend that you browse the Ajax Control Toolkit site. You will also find some cool examples that use the Modal Popup in this link. The following figure shows a screenshot of the custom listener in action.
Figure 5: Custom listener using the Modal Popup
Now let's move to the implementation part. First, declare the following style sheet in your page. This will be used for the popup background.
Next, add an ASP.NET Panel:
We are showing a generic error message and we are also providing a collapsible
div, which shows the actual error message upon clicking the link. Next, add a Modal Popup like so:
div as well as hiding the Modal Popup when the Continue button is clicked. Let's see these functions.
We are also passing two additional parameters in the constructor: The
id of the modal popup (or the modal popup itself) and the collapsible
div ID (or the
div itself). Next, when the
PublishException method is invoked, we are calling the base class
FormatExeception method to get the formatted details of the exception. Then, the formatted details are displayed through the div's
innerHTML property. Finally, we call the
show method of the modal popup.
Now let's find how we can integrate this new trace listener into our logging system. First, add a
Ajax.Logging.ExceptionManager.js file, like so:
Next, add a
script tag after the
ScriptManager and add this listener in the Sys.Application load event handler, as we did before.
Few key points
Throughout this component, I have used
errorCode will help us to pin point the exact cause and location of this exception. Therefore, it is recommend to use different error codes for each exception. Maybe you can create a list of constants with these error codes as I did in the default.aspx page in the attached sample.
customErrors mode to
On in the
web.config file (recommended) when deploying the website, you'll obtain the generic message "There was an error processing the request" and no exception type and stack trace. I think this is unfortunate; at least the exception message and type should be present on the client side. May be the ASP.NET AJAX Team will consider this in future release.
Certainly there are many places where we can enrich the logger, such as routing an exception to predefined listeners (instead of all) or encapsulating it in a server side component so that the developer can easily configure it without writing a single line of code. Maybe I will implement those in the next version of this component. However, it will give you a good start in hunting the exceptions of your application.
Kazi Manzur Rashid, Nickname Amit is a Diehard fan of Microsoft Technology. He started programming with Visual Basic 5.0 back in 1996. Since then he has developed many diversified solutions in his professional career, which spans from Anti-Spyware Tool to Personalized Start Page. Currently He is wor...
This author has published 10 articles on DotNetSlackers. View other articles or the complete profile here.
Please login to rate or to leave a comment.