vs2005新控件演示系列之 向导《Wizard》

通过使用窗体收集用户输入是 Web 开发中一个要反复涉及的任务。用来完成某个任务的一组窗体通常称为“向导”。ASP.NET 提供了 Wizard 控件，可以简化许多与生成一系列窗体以收集用户输入的操作关联的任务。

生成一系列相互连接的窗体来分解数据的收集工作是一种普遍的做法。可以通过在每个步骤中管理各窗体之间的导航、数据持久性和状态管理来做到这一点。

ASP.NET Wizard 控件简化了许多与生成多个窗体以及收集用户输入的操作关联的任务。Wizard 控件提供了一种简单的机制，允许轻松地生成步骤、添加新步骤或重新安排步骤。无需编写代码即可生成线性和非线性的导航，并自定义控件的用户导航。 

利用 Wizard 控件，您可以使用分离的步骤来收集数据，这样就允许用户在各步骤之间自主导航，从而获得更简单的用户体验。作为一名开发人员，您不必担心如何跨页保持数据的问题，Wizard 控件会在用户完成各个步骤时维护好状态。

向导步骤

Wizard 控件使用多个步骤来描绘用户数据输入的不同部分。该控件内的每个步骤均会给定一个 StepType，用以指示这一步骤是开始步骤、中间步骤还是完成步骤。向导可以根据需要带有任意数量的中间步骤。您可以添加不同的控件（如 TextBox 或 ListBox 控件）来收集用户输入。当到达 Complete 步骤时，所有数据都可供访问。

下面是演示：
当然，你也可以直接下载我的完整源文件，https://files.cnblogs.com/thcjp/Wizard.rar 压缩包里有asp.net的5个完整演示，加上我做的就6个，这6个你全部看懂了，你也就把这个控件的使用基本都搞明白了！！

Wizard控件的HTML代码
 <asp:Wizard ID="Wizard1" runat="server" ActiveStepIndex="0" BackColor="#E6E2D8" BorderColor="#999999"
            BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" Height="98px"
            Width="208px" BorderStyle="Solid" OnActiveStepChanged="Wizard1_ActiveStepChanged">
            <StepStyle BackColor="#F7F6F3" BorderColor="#E6E2D8" BorderStyle="Solid" BorderWidth="2px" />
            <SideBarStyle BackColor="#1C5E55" Font-Size="0.9em" VerticalAlign="Top" />
            <NavigationButtonStyle BackColor="White" BorderColor="#C5BBAF" BorderStyle="Solid"
                BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#1C5E55" />
            <WizardSteps>
                <asp:WizardStep runat="server" Title="第一步" ID="aa">
                    第一步：<br />
                    姓名：<asp:TextBox ID="TextBox1" runat="server" Width="110px"></asp:TextBox>
                    <br />
                    密码：<asp:TextBox ID="TextBox2" runat="server" Width="108px"></asp:TextBox>
                </asp:WizardStep>
                <asp:WizardStep runat="server" Title="第二步" ID="bb">
                    第二步：<br />
                    性别：<asp:DropDownList ID="DropDownList1" runat="server">
                        <asp:ListItem>男</asp:ListItem>
                        <asp:ListItem>女</asp:ListItem>
                    </asp:DropDownList>
                    <br />
                    <br />
                    是否继续注册<br />
                    <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal">
                        <asp:ListItem Selected="True">是</asp:ListItem>
                        <asp:ListItem>否</asp:ListItem>
                    </asp:RadioButtonList>
                </asp:WizardStep>
                <asp:WizardStep runat="server" Title="第三步" ID="cc">
                    第三步：<br />
                    你的学历
                    <asp:DropDownList ID="DropDownList2" runat="server">
                        <asp:ListItem>院士</asp:ListItem>
                        <asp:ListItem>博士</asp:ListItem>
                        <asp:ListItem>硕士</asp:ListItem>
                        <asp:ListItem>学士</asp:ListItem>
                        <asp:ListItem>研究生</asp:ListItem>
                    </asp:DropDownList>
                    <br />
                    你的年龄
                    <asp:DropDownList ID="DropDownList3" runat="server">
                        <asp:ListItem Value="10">0-10</asp:ListItem>
                        <asp:ListItem Value="20">11-20</asp:ListItem>
                        <asp:ListItem Value="30">21-30</asp:ListItem>
                        <asp:ListItem Value="50">31-50</asp:ListItem>
                        <asp:ListItem Value="50">50↑</asp:ListItem>
                    </asp:DropDownList>
                </asp:WizardStep>
                <asp:WizardStep ID="dd" runat="server" StepType="Complete" Title="结果">
                    第一步结果：<br />
                    <asp:Label ID="Label1" runat="server"></asp:Label>
                    <br />
                    <asp:Label ID="Label2" runat="server"></asp:Label>
                    <br />
                    <br />
                    第二步结果：<br />
                    <asp:Label ID="Label3" runat="server"></asp:Label>
                    <br />
                    <br />
                    第三步结果：<br />
                    <asp:Label ID="Label6" runat="server"></asp:Label>
                    <br />
                    <asp:Label ID="Label4" runat="server"></asp:Label>
                    <br />
                    <asp:Label ID="Label5" runat="server"></asp:Label>
                </asp:WizardStep>
            </WizardSteps>
            <SideBarButtonStyle ForeColor="White" />
            <HeaderStyle BackColor="#666666" BorderColor="#E6E2D8" BorderStyle="Solid" BorderWidth="2px"
                Font-Bold="True" Font-Size="0.9em" ForeColor="White" HorizontalAlign="Center" />
            <HeaderTemplate>
                这是头模板
            </HeaderTemplate>
        </asp:Wizard>

后台CS代码
    protected void Wizard1_ActiveStepChanged(object sender, EventArgs e)
    {
        Label1.Text = "用户名：" + TextBox1.Text.ToString();
        Label2.Text = "密　码：" + TextBox2.Text.ToString();

        Label3.Text = "你的性别：" + DropDownList1.SelectedValue.ToString();
            if (RadioButtonList1.SelectedValue == "否")
            {//判断第二步中是否继续，其实这个在第一步最好，我只是做到第二步才想起加这样一个而已
                Wizard1.ActiveStepIndex = 3;//直接显示最后一个子页
                Label6.Text = "用户中途退出了注册";
                Label4.Visible = false;//隐藏后面两个控件
                Label5.Visible = false;
            }
        Label4.Text = "你的学历：" + DropDownList2.SelectedValue.ToString();//否则继续显示
        Label5.Text = "你的年龄：" + DropDownList3.SelectedValue.ToString();
    }

标题		请输入标题
姓名		请输入你的姓名
主页
内容(提交失败后,可以通过“恢复上次提交”恢复刚刚提交的内容) 请输入评论内容
有回复时邮件通知我
	注销  使用高级评论  新用户注册  返回页首  恢复上次提交    订阅回复
[使用Ctrl+Enter键可以直接提交]
相关文章: MemberShip，角色，WebPart在web.config文件中的参数简述 关于vs2005入门.net2.0系列视频教程问题征集 郁闷..一级教程我录了两次都失败了! vs2005入门 之 起始页与创建WEB站点和创建新页面[视频] vs2005入门--准备工作 使用Visual Studio2005入门.Net2.0系列视频教程 Atlas入门-使用服务端定时控件TimerControl [视频] Atlas入门-UpdateProgress(利用GridView翻页)[视频] Atlas入门-将普通控件升级为Atlas控件/使用listView显示数据库数据[视频] Atlas入门-.NET下的无刷新二级联动菜单[视频]