通过

通过验证控件使用 TextBoxWatermark (VB)

  • 项目

作者 ：Christian Wenz

下载 PDF

AJAX 控件工具包中的 TextBoxWatermark 控件扩展了一个文本框，以便在该框中显示文本。 当用户单击该框时，它将被清空。 如果用户离开框而不输入文本，预填充的文本将重新出现。 这可能会与同一页上的 ASP.NET 验证控件发生冲突，但这些问题可能会得到解决。

概述

TextBoxWatermark AJAX 控件工具包中的控件扩展了一个文本框，以便在该框中显示文本。 当用户单击该框时，它将被清空。 如果用户离开框而不输入文本，预填充的文本将重新出现。 这可能会与同一页上的 ASP.NET 验证控件发生冲突，但这些问题可能会得到解决。

步骤

示例的基本设置如下： TextBox 控件使用 TextBoxWatermarkExtender 控件进行水印。 按钮触发回发，稍后将用于触发页面上的验证控件。 此外，需要控件 ScriptManager 来初始化 ASP.NET AJAX：

<form id="form1" runat="server">
 <asp:ScriptManager ID="asm" runat="server" />
 <div>
 <asp:TextBox ID="Name" runat="server" /> <br />
 <asp:Button ID="btn" runat="server" Text="Submit" OnClick="btn_Click" /><br />
 <asp:Label ID="lbl" runat="server" />
 </div>
 <ajaxToolkit:TextBoxWatermarkExtender ID="tbwe" runat="server"
 TargetControlID="Name" WatermarkText=" Your Name " />
</form>

现在添加一个 RequiredFieldValidator 控件，用于检查提交表单时字段中是否存在文本。 InitialValue验证器的 属性必须设置为控件中使用的TextBoxWatermarkExtender相同值：提交表单时，未更改文本框的值是其中的水印值：

<asp:RequiredFieldValidator ID="rfv1" ControlToValidate="Name"
 Text="*" InitialValue=" Your Name " Display="Dynamic" runat="server" />

但是，此方法存在一个问题：如果客户端禁用 JavaScript，则文本字段不会预先填充水印文本，因此 RequiredFieldValidator 不会触发错误消息。 因此，需要第二 RequiredFieldValidator 个控件来检查空文本框 (省略 InitialValue 属性) 。

<asp:RequiredFieldValidator ID="rfv2" ControlToValidate="Name"
 Text="*" Display="Dynamic" runat="server" />

由于两个验证程序都使用 Display="Dynamic"，最终用户无法区分两个验证程序中哪个被触发的视觉外观;相反，看起来只有其中一个。

最后，如果没有验证程序发出错误消息，请添加一些服务器端代码以输出字段中的文本：

<script runat="server">
 Protected Sub btn_Click(ByVal sender As Object, ByVal e As System.EventArgs)
 lbl.Text = HttpUtility.HtmlEncode(Name.Text)
 End Sub
</script>

验证程序抱怨字段中没有文本

验证程序抱怨字段中没有文本 (单击以查看全尺寸图像)

上一篇