The ASP.NET Wizard control simplifies many of the tasks that are associated with building multiple forms and collecting user input. The Wizard control provides a simple mechanism that allows you to easily build steps, add a new step, or reorder the steps. You can build linear and non-linear navigation and customize the control's user navigation without writing code. In this tutorial, we will show you to create a contact step by step using wizard control in ASP.NET 2.0 and C#.
First, import the namespace of System.Text.
The System.Text namespace contains classes representing ASCII, Unicode, UTF-7, and UTF-8 character encodings; abstract base classes for converting blocks of characters to and from blocks of bytes; and a helper class that manipulates and formats String objects without creating intermediate instances of String.
We are using Server Intellect and have found that by far, they are the most friendly, responsive, and knowledgeable support team we've ever dealt with!
Then, add two events UserWizard_NextButtonClick and OnFinish in the Default.aspx page.
protected void UserWizard_NextButtonClick(object sender, WizardNavigationEventArgs e)
{
if (UserWizard.WizardSteps[e.NextStepIndex].StepType == WizardStepType.Finish)
{
StringBuilder sb = new StringBuilder("");
sb.AppendFormat("UserName:{0}<br/>", Name.Text);
sb.AppendFormat("Position:{0}<br />", Seat.Text);
sb.AppendFormat("E-Mail:{0}<br />", Mail.Text);
sb.AppendFormat("Mobile:{0}<br />", Mobile.Text);
sb.AppendFormat("Notes:{0}<br /><hr>", Notes.Text);
LabMessage.Text = sb.ToString();
}
protected void OnFinish(object sender, WizardNavigationEventArgs e)
{
LabFinish.Text = "Save Successfully.";
}
|
We moved our web sites to Server Intellect and have found them to be incredibly professional. Their setup is very easy and we were up and running in no time.
The front end Default.aspx page looks something like this:
<form id="Form1" runat="server">
<div>
<fieldset style="width: 310px">
<legend class="mainTitle">WizardDemo</legend>
<br />
<asp:Wizard ID="UserWizard" HeaderText="New an user" OnFinishButtonClick="OnFinish"
ActiveStepIndex="0" Height="120px" runat="server" BackColor="#FFFBD6" BorderColor="#FFDFAD"
BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" OnNextButtonClick="UserWizard_NextButtonClick">
<SideBarTemplate>
<div style="width: 90px;">
<asp:DataList runat="Server" ID="SideBarList">
<ItemTemplate>
<img src="Images/point.gif" />
<asp:LinkButton runat="server" ID="SideBarButton" ForeColor="#FFF277" Font-Underline="false"></asp:LinkButton>
</ItemTemplate>
</asp:DataList>
</div>
</SideBarTemplate>
<WizardSteps>
<asp:WizardStep ID="WizardStep1" runat="server" Title="Name and Position">
<div style="width: 220px;">
<table>
<tr>
<td style="width: 60px; height: 42px">
UserName:</td>
<td style="height: 42px">
<asp:TextBox runat="server" ID="Name" />
<asp:RequiredFieldValidator runat="server" ID="NameValidator" Text="*" ErrorMessage="Please input UserName."
SetFocusOnError="True" ControlToValidate="Name" />
</td>
</tr>
<tr>
<td style="width: 60px">
Position:</td>
<td>
<asp:TextBox runat="server" ID="Seat" />
<asp:RequiredFieldValidator runat="server" ID="SeatValidator" Text="*" ErrorMessage="Please input Position."
SetFocusOnError="True" ControlToValidate="Seat" />
</td>
</tr>
<tr>
<td height="60" style="width: 60px">
</td>
<td valign="bottom">
<asp:ValidationSummary runat="server" DisplayMode="List" ID="Summary" />
</td>
</tr>
</table>
</div>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep2" runat="server" Title="Contact">
<div style="width: 220px;">
<table>
<tr>
<td>
E-Mail:</td>
<td>
<asp:TextBox runat="server" ID="Mail" /></td>
</tr>
<tr>
<td>
Mobile:</td>
<td>
<asp:TextBox runat="server" ID="Mobile" /></td>
</tr>
<tr>
<td height="60">
</td>
</tr>
</table>
</div>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep3" runat="server" Title="Notes">
<div style="width: 220px;">
<table>
<tr>
<td valign="top">
Notes:</td>
<td>
<asp:TextBox runat="server" ID="Notes" Rows="6" Columns="18" TextMode="MultiLine" /></td>
</tr>
</table>
</div>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep4" runat="server" StepType="Finish" Title="Summary">
<div style="width: 220px;">
<asp:Label runat="server" ID="LabMessage" />
</div>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep5" runat="server" StepType="Complete" Title="Finish">
<div style="width: 310px;">
<asp:Label runat="server" ID="LabFinish" />
</div>
</asp:WizardStep>
</WizardSteps>
<SideBarStyle BackColor="#990000" Font-Size="0.9em" VerticalAlign="Top" />
<NavigationButtonStyle Width="80px" BackColor="White" BorderColor="#CC9966" BorderStyle="Solid"
BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#990000" />
<SideBarButtonStyle ForeColor="White" />
<HeaderStyle Height="24px" BackColor="#FFCC66" BorderColor="#FFFBD6" BorderStyle="Solid"
BorderWidth="2px" Font-Bold="True" Font-Size="0.9em" ForeColor="#333333" HorizontalAlign="Center" />
</asp:Wizard>
</fieldset>
</div>
</form>
|
Server Intellect offers Windows Hosting Dedicated Servers at affordable prices. I'm very pleased!
The flow for the code behind page is as follows.
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Text;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void UserWizard_NextButtonClick(object sender, WizardNavigationEventArgs e)
{
if (UserWizard.WizardSteps[e.NextStepIndex].StepType == WizardStepType.Finish)
{
StringBuilder sb = new StringBuilder("");
sb.AppendFormat("UserName:{0}<br/>", Name.Text);
sb.AppendFormat("Position:{0}<br />", Seat.Text);
sb.AppendFormat("E-Mail:{0}<br />", Mail.Text);
sb.AppendFormat("Mobile:{0}<br />", Mobile.Text);
sb.AppendFormat("Notes:{0}<br /><hr>", Notes.Text);
LabMessage.Text = sb.ToString();
}
}
protected void OnFinish(object sender, WizardNavigationEventArgs e)
{
LabFinish.Text = "Save Successfully.";
} |
Looking for the VB.NET 2005 Version? Click Here!
Looking for more ASP.NET Tutorials? Click Here!