Click here to Skip to main content
11,647,748 members (65,488 online)
Click here to Skip to main content

AJAX Enabled MessageBox

, 14 Sep 2009 CPOL 110.8K 6.8K 108
Rate this:
Please Sign up or sign in to vote.
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 MessageBoxthat we will generate:

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

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

The MessageBoxwill 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 messageclass. Messageclass is a simple class, having only two properties which are MessageTextof stringtype and MessageTypeof enmMessageTypetype. enmMessageTypehas four items: Error, Success, Attentionand Info.

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

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 usercontrolis that it is AJAX enabled. All the contents of the usercontrolare inside an UpdatePanelnamed udpMsjwhich has an UpdateModeof Conditional. And OnPreRenderstate of the usercontrolif any message is added, the UpdatePanelis 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 usercontrolany more, instead I will show the usage of these methods and this will make things precise.

1. Simply Showing A Message

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 AddMessagemethod which is YaBu.MessageBox.uscMsgBox.enmMessageType.Info, the message will have a different appearance as shown below.

When the MessageTypeis set to ERROR:

ErrorMessage

When the MessageTypeis set to ATTENTION:

AttentionMessage

When the MessageTypeis set to SUCCESS:

SuccessMessage

2. Show Multiple Messages at a Time

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:

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 messageboxfor 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)

Share

About the Author

Yavuz Küçükpetek
Software Developer (Senior) NetCad
Turkey Turkey
Yavuz is a software developer since 2001 and working as senior software developer at NetCad in Ankara, Turkey. 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. He also writes articles both in Turkish and English at: http://www.dotnetgurus.net

You may also be interested in...

Comments and Discussions

 
QuestionDrag&drop uscMsgBox Pin
gerhard4527-Jan-10 1:00
membergerhard4527-Jan-10 1:00 

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

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

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.150804.3 | Last Updated 15 Sep 2009
Article Copyright 2009 by Yavuz Küçükpetek
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid