Enhancing a Text Box with the TextBoxWatermarkExtender

The TextBoxWatermarkExtender is a part of the AJAX Control Toolkit that provides a simple way to add watermarks to text boxes in an ASP.NET Web page. A watermark is a message that is displayed inside a text box, but which disappears when the user types something in the box.

To use the TextBoxWatermarkExtender, you must first download and install the AJAX Control Toolkit from the ASP.NET AJAX website. Once you have done this, you can add the extender to a text box in your Web page as follows:

Add a reference to the AJAX Control Toolkit in your Web page:

<%@ Register Assembly=”AjaxControlToolkit” Namespace=”AjaxControlToolkit” TagPrefix=”ajaxToolkit” %>

Add a text box to your Web page:

<asp:TextBox ID=”txtSearch” runat=”server” />

Add a TextBoxWatermarkExtender control to your Web page:

<ajaxToolkit:TextBoxWatermarkExtender ID=”txtSearchWatermark” runat=”server”

TargetControlID=”txtSearch” WatermarkText=”Enter search text here” />

In this example, the TextBoxWatermarkExtender is given an ID of “txtSearchWatermark”, and is associated with the text box by setting the TargetControlID attribute to the ID of the text box. The WatermarkText attribute specifies the text that should be displayed as the watermark.

Optionally, you can customize the appearance of the watermark by setting the WatermarkCssClass property:

<ajaxToolkit:TextBoxWatermarkExtender ID=”txtSearchWatermark” runat=”server”

TargetControlID=”txtSearch” WatermarkText=”Enter search text here”

WatermarkCssClass=”watermark” /> In this example, the WatermarkCssClass property is set to “watermark”, which is a CSS class that can be used to style the watermark.