I hope you can solve my problem. I wanna when i click finish button (in Confirm step)...A summary information will show in Finished step..Please see my code:
Thank for reading and have a nice day :)
ASPX <body>
<form id="form1" runat="server">
<div>
<asp:Wizard ID="Wizard1" runat="server" ActiveStepIndex="0" OnLoad="Wizard1_Load" DisplaySideBar="false" OnPreRender="Wizard1_PreRender">
<WizardSteps>
<asp:WizardStep runat="server" Title="Information">
<div class="content">
<table class="auto-style1">
<tr>
<td>
<asp:Label ID="Label1" runat="server" Text="Firstname"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label2" runat="server" Text="Lastname"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</td>
</tr>
</table>
</div>
</asp:WizardStep>
<asp:WizardStep runat="server" Title="Payment">
<div class="content">
<table class="auto-style1">
<tr>
<td>
<asp:RadioButton ID="RadioButton1" runat="server" Text="Credit card" />
</td>
<td>
<asp:RadioButton ID="RadioButton2" runat="server" Text="Paypal" />
</td>
</tr>
</table>
</div>
</asp:WizardStep>
<asp:WizardStep runat="server" Title="Confirm">
<div class="content">
<table class="auto-style1">
<tr>
<td>
<asp:Label ID="Label3" runat="server" Text="Firstname"></asp:Label>
</td>
<td>
<asp:Label ID="Label5" runat="server" Text="Label"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label4" runat="server" Text="Lastname"></asp:Label>
</td>
<td>
<asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>
</td>
</tr>
</table>
</div>
</asp:WizardStep>
<asp:WizardStep runat="server" StepType="Complete" Title="Finished">
<div class="content">Finished</div>
</asp:WizardStep>
</WizardSteps>
<HeaderTemplate>
<ul id="wizHeader">
<asp:Repeater ID="SideBarList" runat="server">
<ItemTemplate>
<li><a class="<%# GetClassForWizardStep(Container.DataItem) %>" title="<%#Eval("Name")%>">
<%# Eval("Name")%></a> </li>
</ItemTemplate>
</asp:Repeater>
</ul>
</HeaderTemplate>
</asp:Wizard>
</div>
</form>
</body>
C#: protected void Page_Load(object sender, EventArgs e)
{
Wizard1.PreRender += new EventHandler(Wizard1_PreRender);
}
protected void Wizard1_Load(object sender, EventArgs e)
{
Label5.Text = TextBox1.Text;
Label6.Text = TextBox2.Text;
}
protected string GetClassForWizardStep(object wizardStep)
{
WizardStep step = wizardStep as WizardStep;
if (step == null)
{
return "";
}
int stepIndex = Wizard1.WizardSteps.IndexOf(step);
if (stepIndex < Wizard1.ActiveStepIndex)
{
return "prevStep";
}
else if (stepIndex > Wizard1.ActiveStepIndex)
{
return "nextStep";
}
else
{
return "currentStep";
}
}
protected void Wizard1_PreRender(object sender, EventArgs e)
{
Repeater SideBarList = Wizard1.FindControl("HeaderContainer").FindControl("SideBarList") as Repeater;
SideBarList.DataSource = Wizard1.WizardSteps;
SideBarList.DataBind();
}
CSS #wizHeader li .prevStep
{
background-color: #669966;
}
#wizHeader li .prevStep:after
{
border-left-color:#669966 !important;
}
#wizHeader li .currentStep
{
background-color: #C36615;
}
#wizHeader li .currentStep:after
{
border-left-color: #C36615 !important;
}
#wizHeader li .nextStep
{
background-color:#C2C2C2;
}
#wizHeader li .nextStep:after
{
border-left-color:#C2C2C2 !important;
}
#wizHeader
{
list-style: none;
overflow: hidden;
font: 18px Helvetica, Arial, Sans-Serif;
margin: 0px;
padding: 0px;
}
#wizHeader li
{
float: left;
}
#wizHeader li a
{
color: white;
text-decoration: none;
padding: 10px 0 10px 55px;
background: brown; /* fallback color */
background: hsla(34,85%,35%,1);
position: relative;
display: block;
float: left;
}
#wizHeader li a:after
{
content: " ";
display: block;
width: 0;
height: 0;
border-top: 50px solid transparent; /* Go big on the size, and let overflow hide */
border-bottom: 50px solid transparent;
border-left: 30px solid hsla(34,85%,35%,1);
position: absolute;
top: 50%;
margin-top: -50px;
left: 100%;
z-index: 2;
}
#wizHeader li a:before
{
content: " ";
display: block;
width: 0;
height: 0;
border-top: 50px solid transparent;
border-bottom: 50px solid transparent;
border-left: 30px solid white;
position: absolute;
top: 50%;
margin-top: -50px;
margin-left: 1px;
left: 100%;
z-index: 1;
}
#wizHeader li:first-child a
{
padding-left: 10px;
}
#wizHeader li:last-child
{
padding-right: 50px;
}
#wizHeader li a:hover
{
background: #FE9400;
}
#wizHeader li a:hover:after
{
border-left-color: #FE9400 !important;
}
.content
{
height:150px;
padding-top:75px;
text-align:center;
background-color:#F9F9F9;
font-size:48px;
}