可以使用 CreateUserWizardStep 和 CompleteWizardStep 模板来自定义 CreateUserWizard 控件的内容。通过指定模板的内容,您可以指定自己的自定义用户界面 (UI),该用户界面包括 CreateUserWizard 控件用于收集有关新用户的信息的控件,以及您指定的其他控件(有关 CreateUserWizard 控件使用的控件的列表,请参见自定义 ASP.NET 登录控件的外观。)
此外,由于 CreateUserWizard 控件继承自 Wizard 类,因此可以向 CreateUserWizard 控件添加您自己的自定义步骤。有关 Wizard 控件的更多信息,请参见 Wizard Web 服务器控件概述。
注意 |
---|
您也可以使用主题和样式属性自定义 CreateUserWizard 控件的外观。有关详细信息,请参见 ASP.NET 主题和外观概述 和 CreateUserWizard 控件的属性。 |
自定义 CreateUserWizard 步骤
-
按照下面的语法将一个 CreateUserWizard 控件放在页上。
<asp:CreateUserWizard ID="CreateUserWizard1" Runat="server"> <WizardSteps> <asp:CreateUserWizardStep runat="server"> </asp:CreateUserWizardStep> <asp:CompleteWizardStep runat="server"> </asp:CompleteWizardStep> </WizardSteps> </asp:CreateUserWizard>
-
若要自定义用户帐户创建步骤,请在 <asp:CreateUserWizardStep> 元素中创建一个 <ContentTemplate> 元素。在该模板中,添加标记和控件来定义收集所需用户信息的用户界面布局和内容。
注意 如果成员资格提供程序用自定义成员来扩展 MembershipProvider 类,则必须添加用于收集成员资格提供程序创建新用户所需的自定义信息的所有控件。有关详细信息,请参见 CreateUserWizardStep。
下面的代码示例演示一个 CreateUserStep 属性,该属性包括允许用户指定其他选项的 CheckBox 控件。
<asp:CreateUserWizardStep ID="CreateUserWizardStep1" runat="server"> <ContentTemplate> <table border="0" style="font-size: 100%; font-family: Verdana"> <tr> <td align="center" colspan="2" style="font-weight: bold; color: white; background-color: #5d7b9d"> Sign Up for Your New Account</td> </tr> <tr> <td align="right"> <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName"> User Name:</asp:Label></td> <td> <asp:TextBox ID="UserName" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password"> Password:</asp:Label></td> <td> <asp:TextBox ID="Password" runat="server" TextMode="Password"></asp:TextBox> <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" ErrorMessage="Password is required." ToolTip="Password is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="ConfirmPasswordLabel" runat="server" AssociatedControlID="ConfirmPassword"> Confirm Password:</asp:Label></td> <td> <asp:TextBox ID="ConfirmPassword" runat="server" TextMode="Password"></asp:TextBox> <asp:RequiredFieldValidator ID="ConfirmPasswordRequired" runat="server" ControlToValidate="ConfirmPassword" ErrorMessage="Confirm Password is required." ToolTip="Confirm Password is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="EmailLabel" runat="server" AssociatedControlID="Email"> E-mail:</asp:Label></td> <td> <asp:TextBox ID="Email" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="EmailRequired" runat="server" ControlToValidate="Email" ErrorMessage="E-mail is required." ToolTip="E-mail is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="QuestionLabel" runat="server" AssociatedControlID="Question"> Security Question:</asp:Label></td> <td> <asp:TextBox ID="Question" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="QuestionRequired" runat="server" ControlToValidate="Question" ErrorMessage="Security question is required." ToolTip="Security question is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="AnswerLabel" runat="server" AssociatedControlID="Answer"> Security Answer:</asp:Label></td> <td> <asp:TextBox ID="Answer" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="AnswerRequired" runat="server" ControlToValidate="Answer" ErrorMessage="Security answer is required." ToolTip="Security answer is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="center" colspan="2"> <asp:CompareValidator ID="PasswordCompare" runat="server" ControlToCompare="Password" ControlToValidate="ConfirmPassword" Display="Dynamic" ErrorMessage="The Password and Confirmation Password must match." ValidationGroup="CreateUserWizard1"></asp:CompareValidator> </td> </tr> <tr> <td align="center" colspan="2" style="color: red"> <asp:Literal ID="ErrorMessage" runat="server" EnableViewState="False"></asp:Literal> </td> </tr> </table> <asp:CheckBox ID="SubscribeCheckBox" runat="server" Checked="True" Text="Send me a monthly newsletter." /> <br /> <asp:CheckBox ID="ShareInfoCheckBox" runat="server" Checked="True" Text="Share my information with partner sites." /> </ContentTemplate> </asp:CreateUserWizardStep>
-
若要自定义完成步骤,请在 <asp:CompleteWizardStep> 元素中创建一个 <ContentTemplate> 元素。在该模板中,添加标记和控件来定义用于显示确认消息及使用户定位以继续(可选)的用户界面的布局和内容。(必须提供用于收集成员资格提供程序创建新用户帐户所需信息的控件。有关详细信息,请参见 CompleteWizardStep。)
下面的代码示例演示一个 CompleteStep 属性,该属性引用前一个示例中的 CheckBox 控件。
<asp:CompleteWizardStep ID="CompleteWizardStep1" runat="server"> <ContentTemplate> <table border="0" style="font-size: 100%; font-family: Verdana" id="TABLE1" > <tr> <td align="center" colspan="2" style="font-weight: bold; color: white; background-color: #5d7b9d; height: 18px;"> Complete</td> </tr> <tr> <td> Your account has been successfully created.<br /> <br /> <asp:Label ID="SubscribeLabel" runat="server" Text="You have elected to receive our monthly newsletter."></asp:Label><br /> <br /> <asp:Label ID="ShareInfoLabel" runat="server" Text="You have elected to share your information with partner sites."></asp:Label></td> </tr> <tr> <td align="right" colspan="2"> <asp:Button ID="ContinueButton" runat="server" BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px" CausesValidation="False" CommandName="Continue" Font-Names="Verdana" ForeColor="#284775" Text="Continue" ValidationGroup="CreateUserWizard1" /> </td> </tr> </table> </ContentTemplate> </asp:CompleteWizardStep>
-
添加代码以引用其他控件。例如,通过处理 CreatingUser 事件,可以在创建新的用户帐户之前输入代码以收集、验证和修改信息。
下面的代码示例演示引用前面示例中的 CheckBox 控件的 CreatedUser 事件的处理程序,并将它们添加到新创建的用户帐户的 Comment 属性。您将需要向页上的CreateUserWizard 控件添加一个 OnCreatedUser 属性,该控件引用 CreatedUser 事件的处理程序(例如 OnCreatedUser="CreateUserWizard1_CreatedUser"。)
protected void CreateUserWizard1_CreatedUser(object sender, EventArgs e) { // Determine the checkbox values. CheckBox subscribeCheckBox = (CheckBox)CreateUserWizard1.CreateUserStep.ContentTemplateContainer.FindControl("SubscribeCheckBox"); CheckBox shareInfoCheckBox = (CheckBox)CreateUserWizard1.CreateUserStep.ContentTemplateContainer.FindControl("ShareInfoCheckBox"); TextBox userNameTextBox = (TextBox)CreateUserWizardStep1.ContentTemplateContainer.FindControl("UserName"); MembershipUser user = Membership.GetUser(userNameTextBox.Text); user.Comment = "Subscribe=" + subscribeCheckBox.Checked.ToString() + "&" + "ShareInfo=" + shareInfoCheckBox.Checked.ToString(); Membership.UpdateUser(user); // Show or hide the labels based on the checkbox values. Label subscribeLabel = (Label)CreateUserWizard1.CompleteStep.ContentTemplateContainer.FindControl("SubscribeLabel"); Label shareInfoLabel = (Label)CreateUserWizard1.CompleteStep.ContentTemplateContainer.FindControl("ShareInfoLabel"); subscribeLabel.Visible = subscribeCheckBox.Checked; shareInfoLabel.Visible = shareInfoCheckBox.Checked; }
添加向导步骤
-
向 CreateUserWizard 控件的 <WizardSteps> 节添加 <asp:WizardStep> 元素。在您的自定义 CreateUserWizard 控件将使用的附加向导步骤中包括任何控件和标记。
例如,下面的代码示例演示要添加在 CreateUserWizard 控件(该控件包含供用户输入用户名的文本框控件)的 CreateUserStep 之前的步骤。将检查用户名以确保该名称在成员资格数据库中不存在。
<asp:WizardStep ID="CreateUserWizardStep0" runat="server"> <table border="0" style="font-size: 100%; font-family: Verdana" id="TABLE1" > <tr> <td align="center" colspan="2" style="font-weight: bold; color: white; background-color: #5d7b9d"> Select an Account Name</td> </tr> <tr> <td> <asp:Label ID="AccountNameLabel" runat="server" AssociatedControlID="SearchAccount" > Account Name:</asp:Label> <asp:TextBox ID="SearchAccount" runat="server"></asp:TextBox><br /> <asp:Label ID="SearchAccountMessage" runat="server" ForeColor="red" /> </td> </tr> </table> </asp:WizardStep>
-
添加向导步骤的代码。可以处理 Wizard 控件的 NextButtonClick 事件以执行您的代码。CurrentStepIndex 属性值通过步骤索引号(从代表第一个步骤的 0 开始)来指示哪个附加向导步骤引发了 NextButtonClick 事件。
下面的代码示例演示 NextButtonClick 事件的处理程序,该处理程序使用在前一个代码示例的向导步骤的 TextBox 控件中输入的用户名,并验证该用户名,以确保它不是空白的并且在成员资格数据库中不存在。您将需要向页上的 CreateUserWizard 控件添加一个 OnNextButtonClick 属性,该控件引用 NextButtonClick 事件的处理程序(例如OnNextButtonClick="CreateUserWizard1_NextButtonClick"。)
private bool UserExists(string username) { if (Membership.GetUser(username) != null) { return true; } return false; } protected void CreateUserWizard1_NextButtonClick(object sender, WizardNavigationEventArgs e) { if (e.CurrentStepIndex == 0) { if (SearchAccount.Text.Trim() == "" || UserExists(SearchAccount.Text)) { SearchAccountMessage.Text = "That account already exists. Please select an different account name."; e.Cancel = true; } else { TextBox userName = (TextBox)CreateUserWizard1.CreateUserStep.ContentTemplateContainer.FindControl("UserName"); userName.Text = SearchAccount.Text; SearchAccountMessage.Text = ""; e.Cancel = false; } } }
安全注意 该控件具有一个文本框,用于接受用户输入,这是一个潜在的安全威胁。默认情况下,ASP.NET 网页验证用户输入,以确保输入中不包含 HTML 元素或脚本。有关更多信息,请参见脚本侵入概述。
示例
下面的代码示例演示一个 CreateUserWizard 控件,该控件具有为两个基本步骤(CreateUserStep 和 CompleteStep)以及一个添加在 CreateUserStep 之前的附加向导步骤定义的模板。
安全注意 |
---|
该控件具有一个文本框,用于接受用户输入,这是一个潜在的安全威胁。网页中的用户输入可能会包含具有恶意的客户端脚本。默认情况下,ASP.NET 网页验证用户输入,以确保输入中不包含 HTML 元素或脚本。只要启用了此验证,就不需要显式检查用户输入中的脚本或 HTML 元素。有关更多信息,请参见脚本侵入概述。 |
<%@ 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 CreateUserWizard1_CreatedUser(object sender, EventArgs e) { // Determine the checkbox values. CheckBox subscribeCheckBox = (CheckBox)CreateUserWizard1.CreateUserStep.ContentTemplateContainer.FindControl("SubscribeCheckBox"); CheckBox shareInfoCheckBox = (CheckBox)CreateUserWizard1.CreateUserStep.ContentTemplateContainer.FindControl("ShareInfoCheckBox"); TextBox userNameTextBox = (TextBox)CreateUserWizardStep1.ContentTemplateContainer.FindControl("UserName"); MembershipUser user = Membership.GetUser(userNameTextBox.Text); user.Comment = "Subscribe=" + subscribeCheckBox.Checked.ToString() + "&" + "ShareInfo=" + shareInfoCheckBox.Checked.ToString(); Membership.UpdateUser(user); // Show or hide the labels based on the checkbox values. Label subscribeLabel = (Label)CreateUserWizard1.CompleteStep.ContentTemplateContainer.FindControl("SubscribeLabel"); Label shareInfoLabel = (Label)CreateUserWizard1.CompleteStep.ContentTemplateContainer.FindControl("ShareInfoLabel"); subscribeLabel.Visible = subscribeCheckBox.Checked; shareInfoLabel.Visible = shareInfoCheckBox.Checked; } private bool UserExists(string username) { if (Membership.GetUser(username) != null) { return true; } return false; } protected void CreateUserWizard1_NextButtonClick(object sender, WizardNavigationEventArgs e) { if (e.CurrentStepIndex == 0) { if (SearchAccount.Text.Trim() == "" || UserExists(SearchAccount.Text)) { SearchAccountMessage.Text = "That account already exists. Please select an different account name."; e.Cancel = true; } else { TextBox userName = (TextBox)CreateUserWizard1.CreateUserStep.ContentTemplateContainer.FindControl("UserName"); userName.Text = SearchAccount.Text; SearchAccountMessage.Text = ""; e.Cancel = false; } } } </script> <html xmlns="http://www.w3.org/1999/xhtml" > <head id="Head1" runat="server"> <title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div> <asp:CreateUserWizard ID="CreateUserWizard1" runat="server" BackColor="#F7F6F3" BorderColor="#E6E2D8" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" OnNextButtonClick="CreateUserWizard1_NextButtonClick" OnCreatedUser="CreateUserWizard1_CreatedUser" ContinueDestinationPageUrl="~/Default.aspx"> <WizardSteps> <asp:WizardStep ID="CreateUserWizardStep0" runat="server"> <table border="0" style="font-size: 100%; font-family: Verdana" id="TABLE1" > <tr> <td align="center" colspan="2" style="font-weight: bold; color: white; background-color: #5d7b9d"> Select an Account Name</td> </tr> <tr> <td> <asp:Label ID="AccountNameLabel" runat="server" AssociatedControlID="SearchAccount" > Account Name:</asp:Label> <asp:TextBox ID="SearchAccount" runat="server"></asp:TextBox><br /> <asp:Label ID="SearchAccountMessage" runat="server" ForeColor="red" /> </td> </tr> </table> </asp:WizardStep> <asp:CreateUserWizardStep ID="CreateUserWizardStep1" runat="server"> <ContentTemplate> <table border="0" style="font-size: 100%; font-family: Verdana"> <tr> <td align="center" colspan="2" style="font-weight: bold; color: white; background-color: #5d7b9d"> Sign Up for Your New Account</td> </tr> <tr> <td align="right"> <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName"> User Name:</asp:Label></td> <td> <asp:TextBox ID="UserName" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" ErrorMessage="User Name is required." ToolTip="User Name is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password"> Password:</asp:Label></td> <td> <asp:TextBox ID="Password" runat="server" TextMode="Password"></asp:TextBox> <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" ErrorMessage="Password is required." ToolTip="Password is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="ConfirmPasswordLabel" runat="server" AssociatedControlID="ConfirmPassword"> Confirm Password:</asp:Label></td> <td> <asp:TextBox ID="ConfirmPassword" runat="server" TextMode="Password"></asp:TextBox> <asp:RequiredFieldValidator ID="ConfirmPasswordRequired" runat="server" ControlToValidate="ConfirmPassword" ErrorMessage="Confirm Password is required." ToolTip="Confirm Password is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="EmailLabel" runat="server" AssociatedControlID="Email"> E-mail:</asp:Label></td> <td> <asp:TextBox ID="Email" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="EmailRequired" runat="server" ControlToValidate="Email" ErrorMessage="E-mail is required." ToolTip="E-mail is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="QuestionLabel" runat="server" AssociatedControlID="Question"> Security Question:</asp:Label></td> <td> <asp:TextBox ID="Question" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="QuestionRequired" runat="server" ControlToValidate="Question" ErrorMessage="Security question is required." ToolTip="Security question is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="right"> <asp:Label ID="AnswerLabel" runat="server" AssociatedControlID="Answer"> Security Answer:</asp:Label></td> <td> <asp:TextBox ID="Answer" runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="AnswerRequired" runat="server" ControlToValidate="Answer" ErrorMessage="Security answer is required." ToolTip="Security answer is required." ValidationGroup="CreateUserWizard1">*</asp:RequiredFieldValidator> </td> </tr> <tr> <td align="center" colspan="2"> <asp:CompareValidator ID="PasswordCompare" runat="server" ControlToCompare="Password" ControlToValidate="ConfirmPassword" Display="Dynamic" ErrorMessage="The Password and Confirmation Password must match." ValidationGroup="CreateUserWizard1"></asp:CompareValidator> </td> </tr> <tr> <td align="center" colspan="2" style="color: red"> <asp:Literal ID="ErrorMessage" runat="server" EnableViewState="False"></asp:Literal> </td> </tr> </table> <asp:CheckBox ID="SubscribeCheckBox" runat="server" Checked="True" Text="Send me a monthly newsletter." /> <br /> <asp:CheckBox ID="ShareInfoCheckBox" runat="server" Checked="True" Text="Share my information with partner sites." /> </ContentTemplate> </asp:CreateUserWizardStep> <asp:CompleteWizardStep ID="CompleteWizardStep1" runat="server"> <ContentTemplate> <table border="0" style="font-size: 100%; font-family: Verdana" id="TABLE1" > <tr> <td align="center" colspan="2" style="font-weight: bold; color: white; background-color: #5d7b9d; height: 18px;"> Complete</td> </tr> <tr> <td> Your account has been successfully created.<br /> <br /> <asp:Label ID="SubscribeLabel" runat="server" Text="You have elected to receive our monthly newsletter."></asp:Label><br /> <br /> <asp:Label ID="ShareInfoLabel" runat="server" Text="You have elected to share your information with partner sites."></asp:Label></td> </tr> <tr> <td align="right" colspan="2"> <asp:Button ID="ContinueButton" runat="server" BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px" CausesValidation="False" CommandName="Continue" Font-Names="Verdana" ForeColor="#284775" Text="Continue" ValidationGroup="CreateUserWizard1" /> </td> </tr> </table> </ContentTemplate> </asp:CompleteWizardStep> </WizardSteps> <SideBarStyle BackColor="#5D7B9D" BorderWidth="0px" Font-Size="0.9em" VerticalAlign="Top" /> <TitleTextStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" /> <SideBarButtonStyle BorderWidth="0px" Font-Names="Verdana" ForeColor="White" /> <NavigationButtonStyle BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" ForeColor="#284775" /> <HeaderStyle BackColor="#5D7B9D" BorderStyle="Solid" Font-Bold="True" Font-Size="0.9em" ForeColor="White" HorizontalAlign="Center" /> <CreateUserButtonStyle BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" ForeColor="#284775" /> <ContinueButtonStyle BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" ForeColor="#284775" /> <StepStyle BorderWidth="0px" /> </asp:CreateUserWizard> </div> </form> </body> </html>