Click here to Skip to main content
15,860,859 members
Articles / Web Development / ASP.NET

AJAX Enabled MessageBox

Rate me:
Please Sign up or sign in to vote.
4.73/5 (56 votes)
14 Sep 2009CPOL2 min read 197.7K   7.8K   108   57
MessageBox usercontrol that is AJAX ready and has confirmation support

Introduction

As you know, MessageBox, I mean showing popup messages to users is not hard, but there are some complicated issues in web applications because there is no "MessageBox.Show(...)" option in ASP.NET. Inshallah, at the end of this article we will have a similar one.

Using the Code

To get a better idea about our purpose, here is the list of features of the MessageBox that we will generate:

  • The MessageBox should have a simple usage. We should show the message with such a single line of code.
  • The MessageBox should be modal. I mean, a user should not be able to do any other operation while the message is open.
  • The MessageBox should support multiple messages. Multiple messages may be shown through one postback.
  • The MessageBox should have a different appearance according to the type of the message, whether it is an error message or just an information message.
  • The MessageBox should have confirmation functionality.
  • The MessageBox should be AJAX ready.

Now we know what we need and let's analyze how it works.

The MessageBox will be a usercontrol and can be used by adding to the page or to another usercontrol. A simple drag and drop operation.

First we need a message class. Message class is a simple class, having only two properties which are MessageText of string type and MessageType of enmMessageType type. enmMessageType has four items: Error, Success, Attention and Info.

The usercontrol has a method named AddMessage(). This method has two overloads:

C#
public void AddMessage(string msgText, enmMessageType type){....}        
public void AddMessage(string msgText, 
	enmMessageType type, bool postPage, bool showCancelButton, string args){...}

Another important thing about this usercontrol is that it is AJAX enabled. All the contents of the usercontrol are inside an UpdatePanel named udpMsj which has an UpdateMode of Conditional. And OnPreRender state of the usercontrol if any message is added, the UpdatePanel is updated by calling the Update() method. In this way, the content is refreshed only if it is needed.

I will not describe these methods and any other parts of the usercontrol any more, instead I will show the usage of these methods and this will make things precise.

1. Simply Showing A Message

C#
protected void btnInfo_Click(object sender, EventArgs e) 
{     
     uscMsgBox1.AddMessage("The user saved successfully but should be activated 
	by an administrator within 3 days.", 
	YaBu.MessageBox.uscMsgBox.enmMessageType.Info); 
}

This will show the following message:

InfoMessage

Simply by changing the second parameter of the AddMessage method which is YaBu.MessageBox.uscMsgBox.enmMessageType.Info, the message will have a different appearance as shown below.

When the MessageType is set to ERROR:

ErrorMessage

When the MessageType is set to ATTENTION:

AttentionMessage

When the MessageType is set to SUCCESS:

SuccessMessage

2. Show Multiple Messages at a Time

C#
protected void btnMultiple_Click(object sender, EventArgs e) 
{ 
     uscMsgBox1.AddMessage("The user saved successfully.", 
		YaBu.MessageBox.uscMsgBox.enmMessageType.Success);
     uscMsgBox1.AddMessage("The newly saved user account should be 
		activated by an administrator within 3 days", 
		YaBu.MessageBox.uscMsgBox.enmMessageType.Attention);
}

When multiple messages are added:

MultipleMessages

3. Show Confirmation Message

And lastly, we can use it to get confirmation. But this is not as simple as the above ones:

C#
protected void Page_Load(object sender, EventArgs e)
{
     uscMsgBox1.MsgBoxAnswered += MessageAnswered;
}
protected void btnConfirm_Click(object sender, EventArgs e)
{
     uscMsgBox1.AddMessage("Do you confirm to save a new user?.", 
	YaBu.MessageBox.uscMsgBox.enmMessageType.Attention, true, true, txtArg.Text);
}
public void MessageAnswered(object sender, YaBu.MessageBox.uscMsgBox.MsgBoxEventArgs e)
{
     if (e.Answer == YaBu.MessageBox.uscMsgBox.enmAnswer.OK)
     {
          uscMsgBox1.AddMessage("You have just confirmed the transaction. 
		The user saved successfully. You have entered " + txtArg.Text + 
		" as argument.", YaBu.MessageBox.uscMsgBox.enmMessageType.Info);
     }
     else
     {
          uscMsgBox1.AddMessage("You have just cancelled the transaction.", 
				YaBu.MessageBox.uscMsgBox.enmMessageType.Info);
     }
}

The first messagebox for confirmation looks like:

Confirm1Message

And the second one after the user's answer looks like this:

Confirm2Message

That's all, enjoy it. A simple application is attached to this article.

History

  • September 15 2009: First release

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior) NetCad
Turkey Turkey
Yavuz is a software developer since 2001. He has been working as senior software developer in Netigma Project at NetCad since 2012.



He has experience in mostly Microsoft technologies such as ASP.Net, SQL Server, C#, VB.Net, WPF, WCF etc. and especially interested in security and performance issues.

Comments and Discussions

 
QuestionError Trying to use this control in a different control Pin
Member 267020814-Sep-12 8:39
Member 267020814-Sep-12 8:39 
Questionplease upload code in vb? Pin
jichp17-Apr-12 17:07
jichp17-Apr-12 17:07 
SuggestionSource code of the 'YaBu.MessageBox.dll'... Pin
Reza5529-Jan-12 22:39
Reza5529-Jan-12 22:39 
QuestionIssue with key "Enter" Pin
nospherato21-Dec-11 5:10
nospherato21-Dec-11 5:10 
GeneralMy vote of 5 Pin
Mathan_CodeProject19-Nov-11 21:25
Mathan_CodeProject19-Nov-11 21:25 
GeneralVery cool. Pin
Everson SB15-Sep-11 5:07
Everson SB15-Sep-11 5:07 
GeneralRe: Very cool. Pin
pjotr_III29-Nov-11 0:17
pjotr_III29-Nov-11 0:17 
GeneralRe: Very cool. Pin
Everson SB6-Dec-11 0:54
Everson SB6-Dec-11 0:54 
Generalusing client side Pin
Ali Al Omairi(Abu AlHassan)16-Apr-11 23:02
professionalAli Al Omairi(Abu AlHassan)16-Apr-11 23:02 
Generaldon't work whith new AjaxControlToolkit.dll Version=3.5.40412.0 Pin
mitz1-Nov-10 10:20
mitz1-Nov-10 10:20 
GeneralSteps to use the combobox in my project Pin
agrFree2-Jul-10 8:22
agrFree2-Jul-10 8:22 
GeneralThe source is full of errors? even the default.css har some invalid properties Pin
simpa19-Apr-10 9:47
simpa19-Apr-10 9:47 
Im trying to use this i imported the project in visual studio and the project has lot of errors. The errors that i get is: uscMsgBox1 does not exist in the current context. And if i change the text of the messagebox like:

protected void btnAttention_Click(object sender, EventArgs e)
{
uscMsgBox1.AddMessage("test", YaBu.MessageBox.uscMsgBox.enmMessageType.Attention);
}

it still shows:

You must enter the user name.


???

But i changed some css properties and made it look good but what use is it when all this errors??? Sigh | :sigh:
General[My vote of 1] MessageBox Appearance Pin
gerhard4512-Feb-10 2:59
gerhard4512-Feb-10 2:59 
QuestionHave you got the VB.NET version?? Pin
Member 47744552-Feb-10 12:08
Member 47744552-Feb-10 12:08 
AnswerRe: Have you got the VB.NET version?? Pin
nono3142-Feb-10 22:14
nono3142-Feb-10 22:14 
QuestionDo you plan to release a server control version ? Pin
nono3142-Feb-10 3:02
nono3142-Feb-10 3:02 
AnswerRe: Do you plan to release a server control version ? Pin
Ali Al Omairi(Abu AlHassan)16-Apr-11 22:50
professionalAli Al Omairi(Abu AlHassan)16-Apr-11 22:50 
QuestionDrag&drop uscMsgBox Pin
gerhard4527-Jan-10 1:00
gerhard4527-Jan-10 1:00 
QuestionNot work well with Firefox? Pin
vunc26-Nov-09 22:29
vunc26-Nov-09 22:29 
AnswerRe: Not work well with Firefox? Pin
Yavuz Küçükpetek10-Dec-09 10:42
Yavuz Küçükpetek10-Dec-09 10:42 
GeneralVB Project doesn't work ShowConfirmation Pin
brunovianna6-Nov-09 7:09
brunovianna6-Nov-09 7:09 
GeneralRe: VB Project doesn't work ShowConfirmation Pin
Yavuz Küçükpetek10-Dec-09 10:37
Yavuz Küçükpetek10-Dec-09 10:37 
GeneralMy vote of 1 Pin
AryaP21-Oct-09 21:58
AryaP21-Oct-09 21:58 
GeneralRe: My vote of 1 Pin
Yavuz Küçükpetek22-Oct-09 8:21
Yavuz Küçükpetek22-Oct-09 8:21 
GeneralRe: My vote of 1 Pin
Yavuz Küçükpetek22-Oct-09 8:36
Yavuz Küçükpetek22-Oct-09 8:36 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.