向导控制 - 完整步骤始终显示在新页面中? [英] Wizard control - complete step always show in a new page?
本文介绍了向导控制 - 完整步骤始终显示在新页面中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我希望你能解决我的问题。我希望当我点击完成按钮(在确认步骤中)...摘要信息将显示在完成步骤..请看我的代码:
感谢阅读并祝你有愉快的一天:)
ASPX
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">
</td>
<td>
<asp:TextBox ID="TextBox1" runat="server">
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label2" runat="server" Text="Lastname">
</td>
<td>
<asp:TextBox ID="TextBox2" runat="server">
</td>
</tr>
</table>
</div>
<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 runat="server" Title="Confirm">
<div class="content">
<table class="auto-style1">
<tr>
<td>
<asp:Label ID="Label3" runat="server" Text="Firstname">
</td>
<td>
<asp:Label ID="Label5" runat="server" Text="Label">
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label4" runat="server" Text="Lastname">
</td>
<td>
<asp:Label ID="Label6" runat="server" Text="Label">
</td>
</tr>
</table>
</div>
<asp:WizardStep runat="server" StepType="Complete" Title="Finished">
<div class="content">Finished</div>
</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>
</ul>
</HeaderTemplate>
</div>
</form>
</body>
C#:
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
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;
}
推荐答案
my code work w ells but the thing i need is complete step not show in new page. I hope you help :)
my code work wells but the thing i need is complete step not show in new page. I hope you help :)
这篇关于向导控制 - 完整步骤始终显示在新页面中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文