ASP.NET Tutorial/ASP.net Controls/Wizard
Содержание
A simple Wizard control (C#)
<source lang="csharp">
<%@ Page Language="C#" %> <html xmlns="http://www.w3.org/1999/xhtml" > <head id="Head1" runat="server">
<title>Wizard server control</title>
</head> <body>
<form id="form1" runat="server"> <asp:Wizard ID="Wizard1" Runat="server" SideBarEnabled="true" ActiveStepIndex="0"> <WizardSteps> <asp:WizardStep ID="WizardStep1" Runat="server" Title="Step 1"> This is the first step.</asp:WizardStep> <asp:WizardStep ID="WizardStep2" Runat="server" Title="Step 2"> This is the second step.</asp:WizardStep> <asp:WizardStep ID="WizardStep3" Runat="server" Title="Step 3"> This is the third and final step.</asp:WizardStep> </WizardSteps> </asp:Wizard> </form>
</body> </html></source>
A simple Wizard control (VB)
<source lang="csharp">
<%@ Page Language="VB"%> <html xmlns="http://www.w3.org/1999/xhtml" > <head id="Head1" runat="server">
<title>Wizard server control</title>
</head> <body>
<form id="form1" runat="server"> <asp:Wizard ID="Wizard1" Runat="server" SideBarEnabled="true" ActiveStepIndex="0"> <WizardSteps> <asp:WizardStep ID="WizardStep1" Runat="server" Title="Step 1"> This is the first step.</asp:WizardStep> <asp:WizardStep ID="WizardStep2" Runat="server" Title="Step 2"> This is the second step.</asp:WizardStep> <asp:WizardStep ID="WizardStep3" Runat="server" Title="Step 3"> This is the third and final step.</asp:WizardStep> </WizardSteps> </asp:Wizard> </form>
</body> </html></source>
Custom wizard
<source lang="csharp">
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="CustomWizard" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">
<title>Custom Wizard</title> <style type="text/css"> .wizardStepContent { padding: 5px; } .wizardNavContent { padding: 4px; } </style>
</head> <body>
<form id="form1" runat="server"> <asp:Wizard ID="myWizard" runat="server" HeaderText="Checkout" BackColor="#CCCC99" BorderColor="#999999" BorderWidth="1px" Height="200" OnActiveStepChanged="myWizard_ActiveStepChanged" OnNextButtonClick="myWizard_NextButtonClick" OnFinishButtonClick="myWizard_FinishButtonClick" OnPreviousButtonClick="myWizard_PreviousButtonClick" OnSideBarButtonClick="myWizard_SideBarButtonClick"> <HeaderStyle BackColor="#FFFFFF" Font-Size="Medium" VerticalAlign="Top" /> <HeaderTemplate>
<img src="images/title_checkout_step<%= myWizard.ActiveStepIndex+1 %>.gif" alt="Checkout <%= myWizard.ActiveStep.Title%>" />
</HeaderTemplate> <SideBarStyle VerticalAlign="Top" BackColor="#FFFFCC" Font-Size="small" /> <SideBarTemplate> <asp:Panel Style="padding: 10px 10px 10px 10px" ID="panSide" runat="server"> <asp:DataList ID="SideBarList" runat="server"> <ItemTemplate> <asp:ImageButton ID="SideBarButton" runat="server" CommandName="MoveTo" ImageUrl="<%# GetStepImage((string)Eval("Title"))%>" /> </ItemTemplate> <SelectedItemTemplate> <asp:ImageButton ID="SideBarButton" runat="server" CommandName="MoveTo" ImageUrl="<%# GetSelectedStepImage((string)Eval("Title"))%>" /> </SelectedItemTemplate> </asp:DataList> </asp:Panel> </SideBarTemplate> <StepStyle CssClass="wizardStepContent" VerticalAlign="Top" /> <NavigationStyle BackColor="white" VerticalAlign="Bottom" /> <NavigationButtonStyle BackColor="#FFFFCC" ForeColor="#666633" /> <StartNavigationTemplate> <asp:Panel ID="panStart" runat="server" CssClass="wizardNavContent"> <asp:ImageButton runat="server" ID="imgStart" ImageUrl="~/images/button_checkout_start.gif" CommandName="MoveNext" AlternateText="Sign-In" /> </asp:Panel> </StartNavigationTemplate> <StepNavigationTemplate> <asp:Panel ID="panStep" runat="server" CssClass="wizardNavContent"> <asp:ImageButton runat="server" ID="imgPrev" ImageUrl="~/images/button_checkout_previous.gif" CommandName="MovePrevious" AlternateText="Previous" /> <asp:ImageButton runat="server" ID="imgNext" ImageUrl="~/images/button_checkout_next.gif" CommandName="MoveNext" AlternateText="Next" /> </asp:Panel> </StepNavigationTemplate> <FinishNavigationTemplate> <asp:Panel ID="panFinish" runat="server" CssClass="wizardNavContent"> <asp:ImageButton runat="server" ID="imgPrev" ImageUrl="~/images/button_checkout_previous.gif" CommandName="MovePrevious" AlternateText="Previous" /> <asp:ImageButton runat="server" ID="imgPayment" ImageUrl="~/images/button_checkout_finish.gif" CommandName="MoveComplete" AlternateText="Make Payment" /> </asp:Panel> </FinishNavigationTemplate> <WizardSteps> <asp:WizardStep ID="WizardStep1" runat="server" Title="Login" StepType="Start"> Email
<asp:TextBox ID="txtEmail" runat="server" />
Password
<asp:TextBox ID="txtPassword" runat="server" TextMode="Password" /> </asp:WizardStep> <asp:WizardStep ID="WizardStep2" runat="server" Title="Address"> Address Line 1:
<asp:TextBox runat="server" ID="txtAddress1" Width="314px" />
Address Line 2:
<asp:TextBox runat="server" ID="txtAddress2" Width="314px" />
City:
<asp:TextBox runat="server" ID="txtCity" Width="155px" />
State:
<asp:TextBox runat="server" ID="txtState" Width="75px" />
ZIP/Postal Code:
<asp:TextBox runat="server" ID="txtZip" Width="50px" /> </asp:WizardStep> <asp:WizardStep ID="WizardStep3" runat="server" Title="Shipping"> Shipper
<asp:DropDownList ID="drpShipper" runat="server"> <asp:ListItem>Air Mail</asp:ListItem> <asp:ListItem>Xpresspost</asp:ListItem> <asp:ListItem>Fed Ex</asp:ListItem> </asp:DropDownList> </asp:WizardStep> <asp:WizardStep ID="WizardStep4" runat="server" Title="Payment" StepType="Finish" AllowReturn="false"> Payment Type
<asp:DropDownList ID="drpPayment" runat="server"> <asp:ListItem>American Express</asp:ListItem> <asp:ListItem>Visa</asp:ListItem> <asp:ListItem>Mastercard</asp:ListItem> </asp:DropDownList>
Expiry Month:
<asp:DropDownList ID="drpMonth" runat="server"> <asp:ListItem>01</asp:ListItem> <asp:ListItem>02</asp:ListItem> <asp:ListItem>03</asp:ListItem> <asp:ListItem>04</asp:ListItem> <asp:ListItem>05</asp:ListItem> <asp:ListItem>06</asp:ListItem> <asp:ListItem>07</asp:ListItem> <asp:ListItem>08</asp:ListItem> <asp:ListItem>09</asp:ListItem> <asp:ListItem>10</asp:ListItem> <asp:ListItem>11</asp:ListItem> <asp:ListItem>12</asp:ListItem> </asp:DropDownList>
Expiry Year:
<asp:DropDownList ID="drpYear" runat="server"> <asp:ListItem>2005</asp:ListItem> <asp:ListItem>2006</asp:ListItem> <asp:ListItem>2007</asp:ListItem> <asp:ListItem>2008</asp:ListItem> <asp:ListItem>2009</asp:ListItem> <asp:ListItem>2010</asp:ListItem> </asp:DropDownList>
</asp:WizardStep> <asp:WizardStep ID="WizardStep5" runat="server" Title="Confirmation" StepType="Complete"> <asp:Label ID="labConfirmation" runat="server"></asp:Label> </asp:WizardStep> </WizardSteps> </asp:Wizard> <asp:Label ID="myLabel" runat="server"></asp:Label> </form>
</body> </html> File: Default.aspx.cs using System; using System.Data; using System.Configuration; using System.Collections; 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; public partial class CustomWizard : System.Web.UI.Page {
public object GetStepImage(string title) { return "images/sidebar_" + title + ".gif"; } public object GetSelectedStepImage(string title) { return "images/sidebar_" + title + "_selected.gif"; } protected void myWizard_ActiveStepChanged(object sender, EventArgs e) { } protected void myWizard_NextButtonClick(object sender, WizardNavigationEventArgs e) { } protected void myWizard_PreviousButtonClick(object sender, WizardNavigationEventArgs e) { } protected void myWizard_FinishButtonClick(object sender, WizardNavigationEventArgs e) { Label labConfirm = (Label)myWizard.FindControl("labConfirmation"); labConfirm.Text = "Order has been processed for " + txtEmail.Text; labConfirm.Text += "
Shipped via " + drpShipper.SelectedValue; labConfirm.Text += "
Payment from " + drpPayment.SelectedValue; } protected void myWizard_SideBarButtonClick(object sender, WizardNavigationEventArgs e) { e.Cancel = true; }
}</source>
<source lang="csharp">
<%@ Page Language="C#"
AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="CustomNavigationWizard" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">
<title>Custom Navigation Wizard</title> <style type="text/css"> .wizardStepContent { padding: 5px; } .wizardNavContent { padding: 4px; } </style>
</head> <body>
<form id="form1" runat="server"> <asp:Wizard ID="myWizard" runat="server" HeaderText="Checkout" BackColor="#CCCC99" BorderColor="#999999" BorderWidth="1px" Font-Names="Verdana,Arial,Helvetica" Font-Size="Small" Height="200"> <HeaderStyle BackColor="#FFFFFF" Font-Size="Medium" VerticalAlign="Top" /> <HeaderTemplate>
<img src="images/title_checkout_step<%= myWizard.ActiveStepIndex+1 %>.gif" alt="Checkout <%= myWizard.ActiveStep.Title%>" />
</HeaderTemplate> <SideBarStyle VerticalAlign="Top" BackColor="#FFFFCC" Font-Size="small" /> <SideBarTemplate> <asp:Panel Style="padding: 10px 10px 10px 10px" ID="panSide" runat="server"> <asp:DataList ID="SideBarList" runat="server"> <ItemTemplate> <asp:ImageButton ID="SideBarButton" runat="server" CommandName="MoveTo" ImageUrl="<%# GetStepImage((string)Eval("Title"))%>" /> </ItemTemplate> <SelectedItemTemplate> <asp:ImageButton ID="SideBarButton" runat="server" CommandName="MoveTo" ImageUrl="<%# GetSelectedStepImage((string)Eval("Title"))%>" /> </SelectedItemTemplate> </asp:DataList> </asp:Panel> </SideBarTemplate> <StepStyle CssClass="wizardStepContent" VerticalAlign="Top" /> <NavigationStyle BackColor="white" VerticalAlign="Bottom" /> <NavigationButtonStyle BackColor="#FFFFCC" ForeColor="#666633" /> <StartNavigationTemplate> <asp:Panel ID="panStart" runat="server" CssClass="wizardNavContent"> <asp:ImageButton runat="server" ID="imgStart" ImageUrl="~/images/button_checkout_start.gif" CommandName="MoveNext" AlternateText="Sign-In" /> </asp:Panel> </StartNavigationTemplate> <StepNavigationTemplate> <asp:Panel ID="panStep" runat="server" CssClass="wizardNavContent"> <asp:ImageButton runat="server" ID="imgPrev" ImageUrl="~/images/button_checkout_previous.gif" CommandName="MovePrevious" AlternateText="Previous" /> <asp:ImageButton runat="server" ID="imgNext" ImageUrl="~/images/button_checkout_next.gif" CommandName="MoveNext" AlternateText="Next" /> </asp:Panel> </StepNavigationTemplate> <FinishNavigationTemplate> <asp:Panel ID="panFinish" runat="server" CssClass="wizardNavContent"> <asp:ImageButton runat="server" ID="imgPrevFin" ImageUrl="~/images/button_checkout_previous.gif" CommandName="MovePrevious" AlternateText="Previous" /> <asp:ImageButton runat="server" ID="imgFinish" ImageUrl="~/images/button_checkout_finish.gif" CommandName="MoveFinish" AlternateText="Make Payment" /> </asp:Panel> </FinishNavigationTemplate> <WizardSteps> <asp:WizardStep ID="WizardStep1" runat="server" Title="Login"> <asp:Label ID="label1" runat="server">Name</asp:Label> <asp:TextBox ID="txtName" runat="server" />
<asp:Label ID="label2" runat="server">Email</asp:Label> <asp:TextBox ID="txtEmail" runat="server" /> </asp:WizardStep> <asp:WizardStep ID="WizardStep2" runat="server" Title="Address"> <asp:Label ID="label3" runat="server">Address</asp:Label> </asp:WizardStep> <asp:WizardStep ID="WizardStep3" runat="server" Title="Shipping"> <asp:Label ID="label4" runat="server">Shipping</asp:Label> <asp:DropDownList ID="DropDownList1" runat="server"> <asp:ListItem>Air Mail</asp:ListItem> <asp:ListItem>Fed Ex</asp:ListItem> </asp:DropDownList> </asp:WizardStep> <asp:WizardStep ID="WizardStep4" runat="server" Title="Payment"> <asp:Label ID="label5" runat="server">Payment</asp:Label> </asp:WizardStep> <asp:WizardStep ID="WizardStep5" runat="server" Title="Confirmation"> <asp:Label ID="label6" runat="server">Confirmation</asp:Label> </asp:WizardStep> </WizardSteps> </asp:Wizard> </form>
</body> </html>
File: Default.aspx.cs using System; using System.Data; using System.Configuration; using System.Collections; 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; public partial class CustomNavigationWizard: System.Web.UI.Page {
public object GetStepImage(string title) { return "images/sidebar_" + title + ".gif"; } public object GetSelectedStepImage(string title) { return "images/sidebar_" + title + "_selected.gif"; }
}</source>
Displaying a Wizard
<source lang="csharp">
ActiveStep: get the active WizardStep control. ActiveStepIndex: set or get the index of the active WizardStep control. CancelDestinationPageUrl: URL when clicking Cancel button. DisplayCancelButton: hide or display the Cancel button. DisplaySideBar: hide or display the Wizard control"s sidebar. FinishDestinationPageUrl: URL when clicking the Finish button. HeaderText: header text that appears at the top of the Wizard control. WizardSteps: get the WizardStep controls.
The Wizard control supports the following templates:
FinishNavigationTemplate: appearance of the navigation area of the finish step. HeaderTemplate: appearance of the header area. SideBarTemplate: appearance of the sidebar area. StartNavigationTemplate: appearance of the navigation area of the start step. StepNavigationTemplate: appearance of the navigation area of steps that are not start, finish, or complete steps. The Wizard control also supports the following methods: GetHistory(): return the collection of WizardStep controls that have been accessed. GetStepType(): return the type of WizardStep at a particular index.
Possible values are Auto, Complete, Finish, Start, and Step.
MoveTo(): move to a particular WizardStep.
The Wizard control also supports the following events: ActiveStepChanged: Called when a new WizardStep becomes the active step. CancelButtonClick: Called when the Cancel button is clicked. FinishButtonClick: Called when the Finish button is clicked. NextButtonClick: Called when the Next button is clicked. PreviousButtonClick: Called when the Previous button is clicked. SideBarButtonClick: Called when a sidebar button is clicked. The WizardStep control supports the following properties: AllowReturn: prevent or allow a user to return to this step from a future step. Name: return the name of the WizardStep control. StepType: get or set the type of wizard step.
Possible values are Auto, Complete, Finish, Start, and Step.
Title: get or set the title of the WizardStep.
The title is displayed in the wizard sidebar.
Wizard: get the Wizard control containing the WizardStep. The WizardStep also supports the following two events: Activate: Raised when a WizardStep becomes active. Deactivate: Raised when another WizardStep becomes active. <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server">
protected void Wizard1_FinishButtonClick(object sender, WizardNavigationEventArgs e) { lblSSNResult.Text = txtSSN.Text; lblPhoneResult.Text = txtPhone.Text; }
</script> <html xmlns="http://www.w3.org/1999/xhtml" > <head id="Head1" runat="server">
<title>Show Wizard</title>
</head> <body>
<form id="form1" runat="server">
<asp:Wizard id="Wizard1" HeaderText="Product Survey" OnFinishButtonClick="Wizard1_FinishButtonClick" CssClass="wizard" HeaderStyle-CssClass="header" SideBarStyle-CssClass="sideBar" StepStyle-CssClass="step" Runat="server"> <WizardSteps> <asp:WizardStep ID="WizardStep1" Title="Introduction"> Please complete our survey so that we can improve our products. </asp:WizardStep> <asp:WizardStep ID="WizardStep2" Title="Step 1"> <asp:Label id="lblSSN" Text="Social Security Number:" AssociatedControlID="txtSSN" Runat="server" />
<asp:TextBox id="txtSSN" Runat="server" /> </asp:WizardStep> <asp:WizardStep ID="WizardStep3" Title="Step 2" StepType="Finish"> <asp:Label id="lblPhone" Text="Phone Number:" AssociatedControlID="txtPhone" Runat="server" />
<asp:TextBox id="txtPhone" Runat="server" /> </asp:WizardStep> <asp:WizardStep ID="WizardStep4" Title="Summary" StepType="Complete">
Summary
Social Security Number: <asp:Label id="lblSSNResult" Runat="server" />
Phone Number: <asp:Label id="lblPhoneResult" Runat="server" /> </asp:WizardStep> </WizardSteps> </asp:Wizard>
</form>
</body> </html></source>
Help Example Wizard
<source lang="csharp">
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="HelpExampleWizard" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" >
<body> <form id="form1" runat="server"> <asp:Wizard id="Wizard1" runat="server" onfinishbuttonclick="OnFinishButtonClick" backcolor="#EFF3FB" font-names="Verdana" font-size="0.8em" borderwidth="1px" bordercolor="#B5C7DE" style="font-size: medium; font-family: Verdana;" onactivestepchanged="OnActiveStepChanged"> <StepStyle forecolor="#333333" font-size="0.8em" /> <WizardSteps> <asp:WizardStep id="Step1" title="One" allowreturn="false" runat="server" > Welcome to the Wizard example. This step"s AllowReturn property is set to false, so after you leave this step you will not be able to return to it. </asp:WizardStep> <asp:WizardStep id="Step2" title="Two" runat="server" > Please enter your billing information.
Name:
<asp:TextBox runat="server" id="BillingName" width="226px" height="17px" />
E-mail Address:
<asp:TextBox runat="server" id="EmailAddress" width="224px" height="17px" />
Address Line 1:
<asp:TextBox runat="server" id="BillingAddressLine1" width="314px" height="17px" />
Address Line 2:
<asp:TextBox runat="server" id="BillingAddressLine2" width="314px" height="17px" />
City:
<asp:TextBox runat="server" id="BillingCity" width="155px" height="17px" />
State:
<asp:TextBox runat="server" id="BillingState" width="75px" height="17px" />
ZIP Code:
<asp:TextBox runat="server" id="BillingZip" height="17px" />
<asp:CheckBox runat="server" id="SeparateShippingCheckBox" text="Please check here if you would like to add a separate shipping address." /> </asp:WizardStep> <asp:WizardStep id="Step3" title="Three" runat="server" > Please enter your shipping information.
Name:
<asp:TextBox runat="server" id="ShippingName" height="17px" />
Address Line 1:
<asp:TextBox runat="server" id="ShippingAddress1" width="370px" height="17px" />
Address Line 2:
<asp:TextBox runat="server" id="ShippingAddress2" width="370px" height="17px" />
City:
<asp:TextBox runat="server" id="ShippingCity" height="17px" />
State:
<asp:TextBox runat="server" id="ShippingState" width="65px" height="17px" />
ZIP Code:
<asp:TextBox runat="server" id="ShippingZip" height="17px" /> </asp:WizardStep> <asp:WizardStep id="Finish" title="Finish" runat="server" > <asp:Button runat="server" id="GoBackButton" text="Go Back to Step 2" onclick="OnGoBackButtonClick" forecolor="#284E98" font-names="Verdana" font-size="1.0em" borderstyle="Solid" borderwidth="1px" bordercolor="#507CD1" backcolor="White" /> </asp:WizardStep> <asp:WizardStep runat="server" steptype="Complete" title="Complete" id="Complete"> <asp:Label runat="server" id="CompleteMessageLabel" width="408px" height="24px"> </asp:Label> </asp:WizardStep> </WizardSteps> <NavigationButtonStyle forecolor="#284E98" font-names="Verdana" font-size="1.0em" borderstyle="Solid" borderwidth="1px" bordercolor="#507CD1" backcolor="White" /> <HeaderStyle forecolor="White" horizontalalign="Center" font-size="0.9em" font-bold="True" backcolor="#284E98" borderstyle="Solid" bordercolor="#EFF3FB" borderwidth="2px" /> <SideBarStyle verticalalign="Top" horizontalalign="Center" font-size="0.8em" forecolor="#000099" backcolor="#EFF3FB" width="45px" /> <HeaderTemplate> Wizard Example </HeaderTemplate> </asp:Wizard> </form> </body>
</html>
File: Default.aspx.cs using System; using System.Data; using System.Configuration; using System.Collections; 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; public partial class HelpExampleWizard : System.Web.UI.Page {
protected void OnFinishButtonClick(Object sender, WizardNavigationEventArgs e) { Label tempLabel = (Label)Wizard1.FindControl("CompleteMessageLabel"); if (tempLabel != null) { tempLabel.Text = "An e-mail will be sent to " + (EmailAddress.Text.Length == 0 ? "your e-mail address" : EmailAddress.Text) + "."; } } protected void OnGoBackButtonClick(object sender, EventArgs e) { if (Step1.AllowReturn) { Wizard1.ActiveStepIndex = Wizard1.WizardSteps.IndexOf(this.Step1); } else { Wizard1.ActiveStepIndex = Wizard1.WizardSteps.IndexOf(this.Step2); Response.Write("ActiveStep is set to Step2 because Step1 has AllowReturn set to false."); } } protected void OnActiveStepChanged(object sender, EventArgs e) { if (Wizard1.ActiveStepIndex == Wizard1.WizardSteps.IndexOf(this.Step3)) { if (this.SeparateShippingCheckBox.Checked) { Wizard1.MoveTo(this.Step3); } else { Wizard1.MoveTo(this.Finish); } } }
}</source>
Wizard and its steps (C#)
<source lang="csharp">
File: Default.aspx <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="WizardGreetingCardMaker" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server">
<title>Greeting Card Wizard</title>
</head> <body>
<form id="form1" runat="server">
<asp:Wizard ID="Wizard1" runat="server" ActiveStepIndex="0" BackColor="LemonChiffon" BorderStyle="Groove" BorderWidth="2px" CellPadding="10" OnFinishButtonClick="Wizard1_FinishButtonClick" Width="456px"> <WizardSteps> <asp:WizardStep runat="server" Title="Step 1 - Colors"> Choose a foreground (text) color:
<asp:DropDownList ID="lstForeColor" runat="server" Width="194px"> </asp:DropDownList>
Choose a background color:
<asp:DropDownList ID="lstBackColor" runat="server" Width="194px"> </asp:DropDownList> </asp:WizardStep> <asp:WizardStep runat="server" Title="Step 2 - Background"> Choose a border style:
<asp:RadioButtonList ID="lstBorder" runat="server" Height="59px" RepeatColumns="2" Width="177px"> </asp:RadioButtonList>
<asp:CheckBox ID="chkPicture" runat="server" Text="Add the Default Picture" /> </asp:WizardStep> <asp:WizardStep runat="server" Title="Step 3 - Text"> Choose a font name:
<asp:DropDownList ID="lstFontName" runat="server" Width="194px"> </asp:DropDownList>
Specify a font size:
<asp:TextBox ID="txtFontSize" runat="server" ></asp:TextBox>
Enter the greeting text below:
<asp:TextBox ID="txtGreeting" runat="server" TextMode="MultiLine" Width="240px" ></asp:TextBox> </asp:WizardStep> <asp:WizardStep runat="server" StepType="Complete" Title="Greeting Card"> <asp:Panel ID="pnlCard" runat="server" Height="445px" HorizontalAlign="Center" Style="z-index: 101;" Width="339px">
<asp:Label ID="lblGreeting" runat="server" Height="150px" Width="272px"></asp:Label> <asp:Image ID="imgDefault" runat="server" Height="160px" Visible="False" Width="212px" /></asp:Panel> </asp:WizardStep> </WizardSteps> </asp:Wizard>
</form>
</body> </html>
File: Default.aspx.cs using System; using System.Data; using System.Configuration; using System.Collections; 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.Drawing; using System.ruponentModel; public partial class WizardGreetingCardMaker : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { string[] colorArray = Enum.GetNames(typeof(System.Drawing.KnownColor)); lstBackColor.DataSource = colorArray; lstBackColor.DataBind(); lstForeColor.DataSource = colorArray; lstForeColor.DataBind(); lstForeColor.SelectedIndex = 34; lstBackColor.SelectedIndex = 163; System.Drawing.Text.InstalledFontCollection fonts; fonts = new System.Drawing.Text.InstalledFontCollection(); foreach (FontFamily family in fonts.Families) { lstFontName.Items.Add(family.Name); } string[] borderStyleArray = Enum.GetNames(typeof(BorderStyle)); lstBorder.DataSource = borderStyleArray; lstBorder.DataBind(); lstBorder.SelectedIndex = 0; imgDefault.ImageUrl = "http://www.nfex.ru/style/logo.png"; } } protected void Wizard1_FinishButtonClick(object sender, WizardNavigationEventArgs e) { pnlCard.BackColor = Color.FromName(lstBackColor.SelectedItem.Text); lblGreeting.ForeColor = Color.FromName(lstForeColor.SelectedItem.Text); lblGreeting.Font.Name = lstFontName.SelectedItem.Text; try { if (Int32.Parse(txtFontSize.Text) > 0) { lblGreeting.Font.Size = FontUnit.Point(Int32.Parse(txtFontSize.Text)); } if (Int32.Parse(txtFontSize.Text) > 0) { lblGreeting.Font.Size = FontUnit.Point(Int32.Parse(txtFontSize.Text)); } } catch { } TypeConverter cnvrt = TypeDescriptor.GetConverter(typeof(BorderStyle)); pnlCard.BorderStyle = (BorderStyle)cnvrt.ConvertFromString(lstBorder.SelectedItem.Text); if (chkPicture.Checked == true) { imgDefault.Visible = true; } else { imgDefault.Visible = false; } lblGreeting.Text = txtGreeting.Text; }
}</source>
WizardStep
<source lang="csharp">
<%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">
<title>Sample Simple Wizard</title>
</head> <body>
<form id="form1" runat="server">
Sample Wizard
<asp:Wizard ID="myWizard" runat="server" HeaderText="Sample Wizard" > <WizardSteps> <asp:WizardStep ID="WizardStep1" runat="server" Title="Step 1"> Step One
<asp:Label ID="label1" runat="server">Name</asp:Label> <asp:TextBox ID="txtName" runat="server" />
<asp:Label ID="label2" runat="server">Email</asp:Label> <asp:TextBox ID="txtEmail" runat="server" /> </asp:WizardStep> <asp:WizardStep ID="WizardStep2" runat="server" Title="Step 2"> Step Two
<asp:Label ID="label3" runat="server">Shipping</asp:Label> <asp:DropDownList ID="drpShipping" runat="server"> <asp:ListItem>Air Mail</asp:ListItem> <asp:ListItem>Fed Ex</asp:ListItem> </asp:DropDownList> </asp:WizardStep> </WizardSteps> </asp:Wizard>
</form>
</body> </html></source>
Wizard template
<source lang="csharp">
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Temp" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<body> <form id="form1" title="FinishNavigationTemplate Example" runat="server"> <asp:Wizard ID="Wizard1" Runat="server" ActiveStepIndex="0" OnFinishButtonClick="OnFinishButtonClick"> <WizardSteps> <asp:WizardStep ID="WizardStep1" Runat="server" Title="Step 1"> This is step one. </asp:WizardStep> <asp:WizardStep ID="WizardStep2" Runat="server" Title="Step 2"> This is step two. </asp:WizardStep> </WizardSteps> <FinishNavigationTemplate> Please enter your email address if you would like a confirmation email: <asp:TextBox ID="emailTextBox" Runat="server"> </asp:TextBox>
<asp:Button ID="Button1" CommandName="MovePrev" Runat="server" Text="Previous" /> <asp:Button ID="Button2" CommandName="MoveComplete" Runat="server" Text="Finish" /> </FinishNavigationTemplate> <HeaderTemplate> FinishNavigationTemplate Example </HeaderTemplate> </asp:Wizard> <asp:Label ID="myLabel" runat="server"></asp:Label> </form> </body>
</html> File: Default.aspx.cs using System; using System.Data; using System.Configuration; using System.Collections; 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; public partial class Temp : System.Web.UI.Page {
public void OnFinishButtonClick(object sender, EventArgs e) { myLabel.Text += "FinishButtonClick called
"; }
}</source>