Some of you may have read my previous post Creating a Simple Site Wide User Notification Pattern. Upon a revision round of thinking, I thought it may be better to actually have a server control. This would offer some significant advantages, the biggest one being that we could drop the BaseMasterPage. Having the control be a strongly typed server control, we could find it on the page by it's type. We would also only have one place to go to maintain the code, rather than digging through a user controls directory along with the App_Code directory.
The first step in the process we will create a Class Library project. In it we will create our UserNotifier class (our control)
For this control, we are going to inherit from the simple Panel control. We know this will be rendered out as a div tag and it will be light weight to the page. We will also give the UserNotifier a couple of attributes defining what out default property will be in the properties window of the control and also what the default tag structure will look like if dragged out of the toolbox.
Next we will setup some custom properties for our UserNotifier.
As you can see our properties will dictate the css classes and images for both the error message and notification message. Now unlike before when we used two separate panels and just toggled the text and visibility of them, we are going to add panels ONLY if messages exist. Also, I thought it would be best to drop the QueryString functionality of our last control and opt instead for the ability to que and display many messages at one time. To easily accomplish this, we can create a nested private class that will hold our message, css class, and image url.
This class will be stored in a list becoming holding a representation of each of our notifications. Now we will need a list to hold them in in our parent class.
Ok, now we have to create the methods that will actually add to the notification que.
Now that we have that accomplished, we will create a private method that will tell the control how to handle each of these messages.
The CreateMessagePanel method will take our notification and create a ready to use panel out of it. Next we will override the CreateChildControls method the Control class to get all of our notifications added into our UserNotifier control.
Now when the CreateChildControls method is called by the .NET framework, we will iterrate through our notification que and pass it to the CreateMessagePanel method getting back a ready loaded Panel control. All we need to do is add it as a child control to our UserNotifier control.
Next we want to keep the ASP.NET Ajax aware state of our previous control. So we will add a JavaScript file to our project and in the properties window we will change the Build Action to "Embedded Resource". Then we will write some javascript in it that will iterrate through the divs on the page checking the ids for "pnlUserNotifierMessage".
Instead of using the pageLoad() function that is recognized by ASP.NET Ajax, we will just add our method to the application to be called on load. This leaves the pageLoad() to be defined somewhere else if we need it. Now we have to inform the assembly of its JavaScript resource. To do this we will put an assembly attribute just after our using statements in our code file.
Ok, now the assembly knows it has the resource. We will make the control reference the web page to the assembly. Here we also have to keep in mind that it needs to be ASP.NET Ajax aware. What we can do is check if there is a ScriptManager control on the page and if there is, we will add it as a ScriptReference in the ScriptManager control. If not, we will simply add it to the ClientScript of the page. We will also disable the ViewState, seeing as how it will not be needed for this control. All this will be done by overriding the OnLoad of the control.
There we have it! our control is ready to go. But wait! We have yet to create our easy access method to it. We will re-create the static NotificationHelper class in the assembly and add some code to it.
Alright, now we have to find a way to get the UserNotifier from the page. We can accomlish this by creating a recusive method that loops through the pages control collection checking each controls type. Once we find it, we can then break out of that loop.
Ok, now that we have a method that will find the control we just need to create the DisplayError and DisplayMessage methods to consume it.
That should do it! All there is left is to add a reference to the dll to your site and add a UserNotification control to the page. You can then use the NotificationHelper methods to display errors and messages on your website. If you put the UserNotifier on a master page, your notification system will be site wide! The page tag should look like so:
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. We removed the ability to use the QueryString notifications, but we did add the message que to display one or more messages at a time.
Enjoy easily notifying your users!
Download the code:
UserNotificationControl.zip (43.99 kb)
Subscribe