[Sample of Apr 26th] MessageBox in ASP.NET
 |
 |
|
 |
 |
|
Sample Downloads: https://code.msdn.microsoft.com/CSASPNETMessageBox-3f1b547d
The sample code demonstrates how to create a MessageBox in asp.net, usually we often use JavaScript functions "alert()" or "confirm()" to show simple messages and make a simple choice with customers, but these dialog boxes is very simple, we cannot add any different and complicate controls, images or styles. As we know, good web sites always have their own web styles, such as typeface and colors, and in this situation, JavaScript dialog boxes looks not very well. So this sample shows how to make an Asp.net MessageBox.
The sample was written by our star sample writer: Arwind Gao.
You can find more code samples that demonstrate the most typical programming scenarios by using Microsoft All-In-One Code Framework Sample Browser or Sample Browser Visual Studio extension. They give you the flexibility to search samples, download samples on demand, manage the downloaded samples in a centralized place, and automatically be notified about sample updates. If it is the first time that you hear about Microsoft All-In-One Code Framework, please watch the introduction video on Microsoft Showcase, or read the introduction on our homepage https://1code.codeplex.com/.
Introduction
The sample code demonstrates how to create a MessageBox in asp.net, usually we often use JavaScript functions "alert()" or "confirm()" to show simple messages and make a simple choice with customers, but these dialog boxes is very simple, we cannot add any different and complicate controls, images or styles. As we know, good web sites always have their own web styles, such as typeface and colors, and in this situation, JavaScript dialog boxes looks not very well. So this sample shows how to make an Asp.net MessageBox.
This project defines a customize MessageBox class with some necessary properties. For example, title, text, icons, buttons, events, etc. The MessageBox class looks like a windows form MessageBox but not the same, because these two application's working mechanism is different, we need display the MessageBox in current web page, rather than open a new page for displaying messages, so we need a Literal control for receiving HTML code and use web service for getting different results.
Running the Sample
Please follow these demonstration steps below.
Step 1: Open the CSASPNETMessageBox.sln. Expand the CSASPNETMessageBox web application and press Ctrl + F5 to show the TestMessageBox.aspx.
Step 2: We will see only a button control on the page, please click it and you will see a message box. This message box is showing with default style because of we have not set more properties, you can click OK button to close it.
Step 3: Then we can browse with another test page to see a more complicate MessageBox. In this page, we can choose the OK button or Cancel button to call web service methods and get the result of method.
Step 4: Please click OK or Cancel button to see result, The Ok screenshot:
Using the Code
Step 1. Create a C# "ASP.NET Empty Web Application" in Visual Studio 2010 or Visual Web Developer 2010. Name it as ��CSASPNETMessageBox". Add a folder named ��App_Code��, we can put some code files in this folder. In this sample, we need create two class library files, ��MessageBox.cs�� and ��MessageBoxCore.cs��. The MessageBox class includes some basic properties, events, enums and method. Developer can use this class in web form code-behind page for creating an Asp.net MessageBox, The MessageBoxCore class is used to store core HTML code of MessageBox.
Step 2. Now we can begin to write code in MessageBoxCore.cs file, we can create a new web form page and put HTML code in it for preview, and we also need some other html code to make this custom MessageBox control looks better, here is the properties of the MessageBoxCore class introduction:
- MessageBoxButtonHTML: This string variable is used to create buttons.
- MessageBoxHTML: This string variable is used to create the frame of MessageBox, it also includes some CSS styles.
- MessageBoxScript: This string variable is used to generate JavaScript code dynamically.
Step 3. You can write or copy the code of MessageBox.cs file in your application, the MessageBox class will make a judgment that generates HTML code by all conditions.
The following code is use to create MessageBox class
public class MessageBox
{
public string MessageText
{
get;
set;
}
public string MessageTitle
{
get;
set;
}
public MessageBoxIcons MessageIcons
{
get;
set;
}
public MessageBoxButtons MessageButtons
{
get;
set;
}
public MessageBoxStyle MessageStyles
{
get;
set;
}
public List<string> SuccessEvent = new List<string>();
public List<string> FailedEvent = new List<string>();
/// <summary>
/// Define an Asp.net MessageBox instance.
/// </summary>
public MessageBox()
{
this.MessageIcons = MessageBoxIcons.System;
this.MessageButtons = MessageBoxButtons.Ok;
this.MessageStyles = MessageBoxStyle.StyleA;
}
/// <summary>
/// Define an Asp.net MessageBox instance.
/// </summary>
/// <param name="text">Message Box text property.</param>
public MessageBox(string text)
{
this.MessageText = text;
this.MessageIcons = MessageBoxIcons.System;
this.MessageButtons = MessageBoxButtons.Ok;
this.MessageStyles = MessageBoxStyle.StyleA;
}
/// <summary>
/// Define an Asp.net MessageBox instance.
/// </summary>
/// <param name="text">MessageBox text property.</param>
/// <param name="title">MessageBox title property.</param>
public MessageBox(string text, string title)
{
this.MessageText = text;
this.MessageTitle = title;
this.MessageIcons = MessageBoxIcons.System;
this.MessageButtons = MessageBoxButtons.Ok;
this.MessageStyles = MessageBoxStyle.StyleA;
}
/// <summary>
/// Define an Asp.net MessageBox instance.
/// </summary>
/// <param name="text">MessageBox text property.</param>
/// <param name="title">MessageBox title property.</param>
/// <param name="icons">MessageBox icon property.</param>
/// <param name="buttons">MessageBox button style.</param>
public MessageBox(string text, string title, MessageBoxIcons icons, MessageBoxButtons buttons, MessageBoxStyle styles)
{
this.MessageText = text;
this.MessageTitle = title;
this.MessageIcons = icons;
this.MessageButtons = buttons;
this.MessageStyles = styles;
}
public string Show(object sender)
{
string iconUrl = string.Empty;
string buttonStyle = string.Empty;
string buttonHTML = string.Empty;
string scriptHTML = string.Empty;
string coreHTML = string.Empty;
StringBuilder builder = new StringBuilder();
switch (this.MessageIcons)
{
case MessageBoxIcons.None:
iconUrl = string.Empty;
break;
case MessageBoxIcons.Warnning:
iconUrl = "";
break;
case MessageBoxIcons.Error:
iconUrl = "";
break;
case MessageBoxIcons.Question:
iconUrl = "";
break;
case MessageBoxIcons.System:
iconUrl = "";
break;
}
switch (this.MessageStyles)
{
case MessageBoxStyle.StyleA:
buttonStyle = "button_classA";
break;
case MessageBoxStyle.StyleB:
buttonStyle = "button_classB";
break;
}
switch (this.MessageButtons)
{
case MessageBoxButtons.Ok:
buttonHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonHTML = String.Format(buttonHTML, "OK", buttonStyle, "Yes();");
builder.Append(buttonHTML);
break;
case MessageBoxButtons.OKCancel:
string buttonOKHTML = string.Empty;
string buttonCancelHTML = string.Empty;
buttonOKHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonOKHTML = String.Format(buttonOKHTML, "OK", buttonStyle, "Yes();");
builder.Append(buttonOKHTML);
builder.Append(" ");
buttonCancelHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonCancelHTML = String.Format(buttonCancelHTML, "Cancel", buttonStyle, "No();");
builder.Append(buttonCancelHTML);
break;
case MessageBoxButtons.YesOrNo:
string buttonYesHTML = string.Empty;
string buttonNoHTML = string.Empty;
buttonYesHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonYesHTML = String.Format(buttonYesHTML, "Yes", buttonStyle, "Yes();");
builder.Append(buttonYesHTML);
builder.Append(" ");
buttonNoHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonNoHTML = String.Format(buttonNoHTML, "No", buttonStyle, "No();");
builder.Append(buttonNoHTML);
break;
case MessageBoxButtons.YesNoCancel:
string buttonYesCHTML = string.Empty;
string buttonNoCHTML = string.Empty;
string buttonCancelCHTML = string.Empty;
buttonYesCHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonYesCHTML = String.Format(buttonYesCHTML, "Yes", buttonStyle, "Yes();");
builder.Append(buttonYesCHTML);
builder.Append(" ");
buttonNoCHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonNoCHTML = String.Format(buttonNoCHTML, "No", buttonStyle, "No();");
builder.Append(buttonNoCHTML);
builder.Append(" ");
buttonCancelCHTML = MessageBoxCore.MessageBoxButtonHtml;
buttonCancelCHTML = String.Format(buttonCancelCHTML, "Cancel", buttonStyle, "No();");
builder.Append(buttonCancelCHTML);
break;
}
string successName = string.Empty;
string failedName = "1";
StringBuilder successBuilder = new StringBuilder();
StringBuilder failedBuilder = new StringBuilder();
if (SuccessEvent != null && SuccessEvent.Count != 0)
{
int eventCounts = SuccessEvent.Count;
for (int i = 0; i < eventCounts; i++)
{
successBuilder.Append("PageMethods.");
successBuilder.Append(SuccessEvent[i].ToString());
successBuilder.Append("(null,null,Success, Failed);");
}
successName = successBuilder.ToString();
}
if (FailedEvent != null && FailedEvent.Count != 0)
{
int eventCounts = FailedEvent.Count;
for (int i = 0; i < eventCounts; i++)
{
failedBuilder.Append("PageMethods.");
failedBuilder.Append(FailedEvent[i].ToString());
failedBuilder.Append("(null,null,Success, Failed);");
}
failedName = failedBuilder.ToString();
}
scriptHTML = MessageBoxCore.MessageBoxScript;
scriptHTML = String.Format(scriptHTML, successName, failedName);
coreHTML = MessageBoxCore.MessageBoxHTML;
coreHTML = String.Format(coreHTML, this.MessageTitle, iconUrl, this.MessageText, builder.ToString());
(sender as Page).ClientScript.RegisterClientScriptBlock(sender.GetType(), "_arg", scriptHTML, true);
return coreHTML;
}
public enum MessageBoxButtons
{
Ok,
OKCancel,
YesOrNo,
YesNoCancel
};
public enum MessageBoxIcons
{
None,
Warnning,
Question,
System,
Error
}
public enum MessageBoxStyle
{
StyleA,
StyleB
}
}
Step 4. In MessageBoxCore class, we find that we use some unspecified CSS styles, we need add a CSS file that includes these styles. You can find this information in MessageBox.css file. The another important thing, we can put this CSS file and some necessary controls such as ScriptManager and Literal control in a UserControl, because we may use MessageBox control in every page of our project, so I think we must make it easy for re-use, we need only drag and drop this UserControl in our web pages and write less code for running.
Step 5. After all step finished, we can create some test pages to see our achievement. We can use this MessageBox to show some tips or make a simple choice, in this sample, we can even access web services method by MessageBox class. Here is using introduction, remember we need drag and drop that Usercontrol in these pages:
The following code is use to show some simple messages via MessageBox, very simple.
protected void btnInvokeMessageBox_Click(object sender, EventArgs e)
{
MessageBox messageBox = new MessageBox();
messageBox.MessageTitle = "Information";
messageBox.MessageText = "Hello everyone, I am an Asp.net MessageBox. Please put your message here and click the following button to close me.";
Literal1.Text = messageBox.Show(this);
}
The following code shows how to create a little complicate MessageBox that it can make a choice and access web methods.
protected void btnInvokeConfirm_Click(object sender, EventArgs e)
{
string title = "Confirm";
string text = @"Hello everyone, I am an Asp.net MessageBox. You can set MessageBox.SuccessEvent and MessageBox.FailedEvent and Click Yes(OK) or No(Cancel) buttons for calling them. The Methods must be a WebMethod because client-side application will call web services.";
MessageBox messageBox = new MessageBox(text, title, MessageBox.MessageBoxIcons.Question, MessageBox.MessageBoxButtons.OKCancel, MessageBox.MessageBoxStyle.StyleB);
messageBox.SuccessEvent.Add("OkClick");
messageBox.SuccessEvent.Add("OkClick");
messageBox.FailedEvent.Add("CancalClick");
Literal1.Text = messageBox.Show(this);
}
[WebMethod]
public static string OkClick(object sender, EventArgs e)
{
return "You have clicked Ok button";
}
[WebMethod]
public static string CancalClick(object sender, EventArgs e)
{
return "You have clicked Cancel button.";
}