When creating websites, it seems that one problem I always run into is how to gracefully notify the user of errors or display messages to them. In most of my sites I use master pages, so I thought it would be pretty sweet to integrate a messaging pattern into my master pages. I also wanted a quick access method to the notification system from any point in the code-behind of the website that was short and simple to call. The messaging pattern should also ajax aware, and notifications should work in both a full and partial postback scenarios. Last, it would be nice to be able to pass notifications in the querystring if need be.

Ok, so let's get started. The first thing we are going to do is create a user control that will encapsulate the display of our notification pattern. So we can start by putting together our display.

Next we will put together some messaging logic in the code-behind of our user control. First we will take care of the methods that will do the display of the messages.

Now we can take care of the code that will parse and display messages incoming from the querystring.

There we go. Now we have a user control that encapsulates all the logic we want to display things on the page. Our next step would be to integrate this into a master page. In order to do this, we will make a base class that inherits the MasterPage class that will have virtual metods for notifications.

Ok, the next step in our messaging system would be to go ahead and create a master page that inherits the BaseMasterPage class and overrides our notification methods. On this master page, we will put our user control and pass the messages into the user control methods for display on the page.

Ok, so I'm going to admit right now that I put the UserNotifier control on the master page within an update panel with UpdateMode="Always". This is because we will need to check on all postbacks for user notifications. All of your update panels should otherwise have and UpdateMode="Conditional". So we now have the ability for our master page to show notifications. What we need now is to make a simple way to access these methods. We can accomplish this by creating a static class that will expose the methods on our master page.

There we have it! The last thing we need to so is make our user control ajax aware. All of our messages will be posted at the top of our content in the maste page, so if something happens when a user is scrolled way down on a page it needs to scroll back to the top to show them the message. During full postbacks we are covered unless you set the MaintainScrollPositionOnPostback to true on the page. Otherwise in a full postback situation the user will be taken to the top of the page. With partial postbacks this is not the case, it will always stay in the same place the postback occured so we need a solution.

This small piece of javascript will be registered to the page when the user control is rendered and populated with the ClientIDs of our notification panels. The pageLoad(sender, args) is a built in part of the ASP.NET Ajax framework and will be called upon the return of each partial postback. When the partial postback returns we will see if either of our notification panels are present and scroll to the top if they are. Note that I could have used the $get to get the panels but I wanted it to be flexible enough to run with or without the ASP.NET Ajax framework.

So there you have it! All you have to do to display notifications from code-behind is call the NotificationHelper.DisplayError() or  NotificationHelper.DisplayMessage() methods to show your users notifications. You also have the ability to pass messages and errors via the query string to a page and they will be displayed as well.

Enjoy easily notifying your users!

Download the code:  

SimpleSiteWideUserNotifications.zip (7.49 kb)