TextBoxWatermark

Descripción

El TextBoxWatemark extiende, de nuevo, al control TextBox. Su funcionalidad consiste en que aparezca un texto (de una clase CSS específica) en el TextBox cuando este no haya sido rellenado por el usuari, de modo que cuando hagamos clic sobre éste, ese texto desaparezca, y si nos vamos del textbox sin haber escrito nada, el texto vuelve a aparecer.

Su finalidad habitual es la de mostrar al usuario cierta información antes de rellenar el TextBox.

Propiedades

• TargetControlID: ID del TextBox que vamos a extender.
• WatermarkText: Texto que se mostrará cuando no haya nada escrito en el TextBox.
• WatermarkCssClass: la clase CSS que se aplicará al TextBox cuando no haya nada escrito.

Ejemplo

Vamos a pedir el nombre de usuario y contraseña. En la primera imagen vemos cómo quedarán los cuadros de texto nada más cargarse la página; en la segunda imagen hemos hecho click sobre el primer TextBox y de inmediato se ha borrado el texto “Nombre de usuario” para dejarnos escribir lo que queramos.

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

<ajaxToolkit:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" runat="server"
TargetControlID="TextBox1"
WatermarkText="Nombre de usuario" />

<ajaxToolkit:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender2" runat="server"
TargetControlID="TextBox2"
WatermarkText="Contraseña" />