Traduction▲
Cet article est la traduction la plus fidèle possible de l'article original : Using TextBoxWatermark With Validation Controls
Étapes▲
La configuration de base de l'exemple est la suivante : on affecte un filigrane à un contrôle TextBox en utilisant un contrôle TextBoxWatermarkExtender. Un bouton déclenche un postback et sera ensuite utilisé pour déclencher les contrôles de validation sur la page. En outre, un contrôle ScriptManager est nécessaire pour initialiser 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>
Maintenant, ajoutez un contrôle RequiredFieldValidator qui vérifie s'il y a du texte dans le champ lorsque le formulaire est soumis. The InitialValue property of the validator must be set to the same value that is used in the TextBoxWatermarkExtender control: When the form is submitted, the value of an unchanged textbox is the watermark value within it: La propriété InitialValue du validateur doit être réglée à la même valeur que celle utilisée dans le contrôle TextBoxWatermarkExtender : Lorsque le formulaire est soumis, la valeur d'une zone de texte inchangée est celle du filigrane :
<asp:RequiredFieldValidator ID
=
"rfv1"
ControlToValidate
=
"Name"
Text
=
"*"
InitialValue
=
"<Your Name>"
Display
=
"Dynamic"
runat
=
"server"
/>
Mais il y a un problème avec cette approche: si le client désactive JavaScript, le champ de texte n'est pas prérempli avec le texte du filigrane, donc le RequiredFieldValidator ne déclenche pas un message d'erreur. Par conséquent, un deuxième contrôle RequiredFieldValidator est nécessaire, qui va vérifier si la zone de texte est vide (en omettant l'attribut InitialValue).
<asp:RequiredFieldValidator ID
=
"rfv2"
ControlToValidate
=
"Name"
Text
=
"*"
Display
=
"Dynamic"
runat
=
"server"
/>
Étant donné que les deux validateurs on l'option Display = "Dynamic", l'utilisateur final ne peut pas distinguer à partir de l'aspect visuel lequel des deux validateurs a été activé. Au lieu de cela, il semble qu'il n'y en avait qu'un seul.
Enfin, ajoutez un peu de code côté serveur pour afficher le texte dans le champ si aucun validateur n'a émis de message d'erreur:
<script runat
=
"server"
>
protected void btn_Click(object sender, EventArgs e){
lbl.Text = HttpUtility.HtmlEncode(Name.Text);
}
</script>