ASP.NET：带有需要验证的文本框的 UpdatePanel

Question

我的情况是 UpdatePanel 中输入电子邮件的文本框需要通过以下方式进行验证： - RequiredFieldValidator - RegularExpressionValidator

每个验证器都有一个ValidatorCalloutExtender，用于在其 UpdatePanel 之外标注错误消息。

我在 Internet 上搜索过解决方案，但从我的研究来看，UpdatePanel 似乎与 Validator 不兼容。我找到了一种解决方案，即创建自定义 onBlur 文本框 (Extending the asp.net textbox...)。不过，我更喜欢不需要太多代码更改的更简单的解决方案。

这是我的 asp.net 代码：

电子邮件：

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
   <ContentTemplate>
      <asp:TextBox ID="txtLoginPageRegisterEmail" runat="server" MaxLength="33" TabIndex="4" BackColor="#DBDBDB" size="40" BorderWidth="0px" AutoPostBack="true" OnTextChanged="txtLoginPageRegisterEmail_TextChanged"></asp:TextBox>
   </ContentTemplate>
   <Triggers>
      <asp:AsyncPostBackTrigger ControlID="txtLoginPageRegisterEmail" />
   </Triggers>
</asp:UpdatePanel>
<asp:RequiredFieldValidator ID="RFVEmail" runat="server" Display="None" ValidationGroup="Registration" ErrorMessage="Email is required." ControlToValidate="txtLoginPageRegisterEmail"></asp:RequiredFieldValidator>
<asp:ValidatorCalloutExtender ID="VCEEmail_ClientState" runat="server" TargetControlID="RFVEmail"></asp:ValidatorCalloutExtender>
<asp:RegularExpressionValidator ID="REVEmail" runat="server" Display="None" ErrorMessage="Please Enter valid Email" ControlToValidate="txtLoginPageRegisterEmail" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="Registration"></asp:RegularExpressionValidator>
<asp:ValidatorCalloutExtender ID="VCEEmail2_ClientState" runat="server" TargetControlID="REVEmail"></asp:ValidatorCalloutExtender>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
    <ContentTemplate></ContentTemplate>
</asp:UpdatePanel>

这是我在 VB 中的代码：

Protected Sub txtLoginPageRegisterEmail_TextChanged(ByVal sender As Object, ByVal e As System.EventArgs)
    Dim img As Image = New Image
    If (chkEmail()) Then
        img.ImageUrl = "~/images/login_pg/reg/r.gif"
    Else
        img.ImageUrl = "~/images/login_pg/reg/x.gif"
    End If

    If (String.IsNullOrEmpty(txtLoginPageRegisterEmail.Text)) Then
        UpdatePanel2.ContentTemplateContainer.Controls.Clear()
    Else
        UpdatePanel2.ContentTemplateContainer.Controls.Add(img)
    End If
End Sub

Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
    ScriptManager.GetCurrent(Me).RegisterAsyncPostBackControl(txtLoginPageRegisterEmail)
End Sub

chkEmail() 调用存储过程来检查电子邮件地址并根据结果返回一个布尔值。

如果我输入无效的电子邮件，它第一次会显示错误消息，但同时它会回发并更新显示正确图像的 UpdatePanel2。之后，清除文本，然后再次输入无效的电子邮件。它不会再显示来自验证器的错误消息。

我希望电子邮件文本框检查并回发到后面的代码，以通过以下步骤验证电子邮件地址。 现在我想要的是首先检查电子邮件文本框并将回发到代码后面以检查此电子邮件是否可用，所以我希望做的步骤是：

1. 用户在文本框中输入电子邮件地址
2. 然后文本框失去焦点（可能使用 onTextChange 事件或带有自定义方法的 onBlur）
3. 请先与Validator核对是否要求输入邮箱或根据表达式拥有有效邮箱
4. 验证成功后，它将向后面的代码发送回传，该代码将在数据库中执行验证
5. 检查后，结果将在另一个UpdatePanel中显示为图像
6. 如果用户清除文本框中的文本，它将清除图像并且不会显示错误消息或仅显示来自RequiredFieldValidator 的错误消息。

Answer 1

首先，将包括扩展器在内的所有验证器放入更新面板中。

其次，在您的文本框上设置验证组，因为它用于发布到服务器，最后也是最重要的是在您的文本框上设置 CausesValidation=true（默认为 false）

另外，您不需要将文本框设置为它所在的更新面板的异步回发触发器控件。默认情况下，ChildrenAsTriggers 是真正的意思，如果回发来自子项，它将导致更新面板刷新。

唷，我花了大约 1 个小时才发现导致验证设置为 false，我想“为什么它不起作用？”