If you have read any of my previous posts on site wide user notification patterns and controls, then you may know where this is going. I have compiled a server control to bring this functionality to the fingertips of my fellow ASP.NET developers! Simply drag and drop the control onto your page or your master page and you are in business. I figured out how tired I was of trying to get notifications to users in a simple way and got tired of rewriting one on every project. Lets take a look at how it works.
Once you are complete, your messages may look something like this:
First put the control on your page:
<rollem:InfoPanel ID="InfoPanel1" runat="server"
ErrorCssClass="err"
ErrorImageUrl="~/images/exclamation.png"
MessageCssClass="msg"
MessageImageUrl="~/images/information.png"
WarningCssClass="wrn"
WarningImageUrl="~/images/warn.png"
EnableViewState="false" />
As you can see, you can set images and css classes for the notifications to use.
There are 3 types of notifications, a message, a warning and an error. Once the control is on your page, all you have to do is call into one of the methods that will display your message like so:
InfoPanel.DefaultInstance.DisplayMessage("This is some message");
InfoPanel.DefaultInstance.DisplayWarning("This is some warning");
InfoPanel.DefaultInstance.DisplayError("This is some error");
These methods will work when the control is on the current page, and they will also work if the control is on your master page as the call for the control is recursive. It will que all the calls to it and display all the qued messages on the next render.
Important to note: When using ASP.NET Ajax, the three server side calls above will work as long as you have a script manager and the InfoPanel control is inside of an UpdatePanel. Now I know what you're saying, "man this control would be great if it worked with JQuery". Well I have news for you, IT DOES!
To call the control on the client side, you would make a call similar to the one you would make on the server side with only one difference. The call on the server side accepts one or two arguments depending on if you want the messages to be qued or not. It also has a method for clearing the messages when you're done with them. So the call would be something like this using JQuery:
$.ajax({
type: "POST",
url: "JQuery.aspx/ThrowException",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
},
error: function(xhr) {
var er = $.parseJSON(xhr.responseText, true);
InfoPanel.DefaultInstance.DisplayError(er.Message);
}
});
The snip above will show an error message when one is encountered. As I said before, you can also use the second argument for queing the messages like so:
$("#btnShowMessages").click(function() {
InfoPanel.DefaultInstance.ClearMessages();
InfoPanel.DefaultInstance.DisplayMessage("Message", true);
InfoPanel.DefaultInstance.DisplayWarning("Warning", true);
InfoPanel.DefaultInstance.DisplayError("Error", true);
});
You don't have to use JQuery, it will work with any JavaScript framework you use.
Conclusion
If you are as tired of trying to build notification patterns from scratch for each ASP.NET website you build as I was, you might give this control a try. It is very flexible and configurable. It only has three calls to use and it will find the control and display your messages. It can be used both server side and client side for allowing notifications no matter what you're doing, or where you're doing it.
Hope this helps!