Solution for conflict between textboxwatermarkextender extender and requiredfieldvalidator Control
Author Zhu Xianzhong Problem description
In useAjaxWhen the Control Toolkit extender textboxwatermarkextender extends, we often need to use the ASP. NET checker control requiredfieldvalidator together. However, when you do not enter text in the text box, the watermarktext attribute of the textboxwatermarkextender will add the watermark effect text in the text box. Therefore, a problem occurs: whether or not the content is entered in the text box, the content of the text box will not be blank. That is to say, this text box will always be able to pass the verification of the checker control requiredfieldvalidator.
What do you do?
Solution
In view of the above contradictions, I will provide several typical solutions below.
Method 1: Use the customvalidator Control
The client Script Function of customvalidator can verify the text box content from the client.
Example:
Username: <asp: textbox id = "username" runat ="
Server "> </ASP: textbox>
<Asp: requiredfieldvalidator id = "rfn" runat = "server" errormessage = "name cannot be blank! "
Controltovalidate = "username"> </ASP: requiredfieldvalidator>
<Ajaxtoolkit: textboxwatermarkextender id = "textboxwatermarkextender1" runat = "server" targetcontrolid = "username" watermarktext = "enter your name here">
</Ajaxtoolkit: textboxwatermarkextender>
<Asp: customvalidator id = "customvalidator1" runat = "server" clientvalidationfunction = "validateusername" errormessage = "enter your name here"
Controltovalidate = "username" display = "dynamic"> * </ASP: customvalidator>
Let's take a look at the corresponding content of the clientvalidationfunction attribute, as shown below:
<Script. type = "text/JavaScript">
Function validateusername (sender, argS ){
If (ARGs. value = "enter your name here "){
Args. isvalid = false;
}
}
............
Rating : In this solution, the verification is handed over to the client JS script. The above function validateusername compares the text box content with the watermark text. If it is the original watermark text, the text box still does not have the input content, thus maintaining the original verification effect of the checker control requiredfieldvalidator.
Method 2: DualRequiredfieldvalidatorWidget
The requiredfieldvalidator control of the validator can be retained without using the client script function. See the following example.Code:
<Asp: textbox id = "tbusername" runat = "server" width = "60%" maxlength = "50"> </ASP: textbox>
<Asp: requiredfieldvalidator id = "rfnameblank" runat = "server" controltovalidate = "tbusername" display = "NONE" errormessage = "user name cannot be blank! "> </ASP: requiredfieldvalidator>
<Asp: requiredfieldvalidator id = "rfnamevalue" runat = "server" controltovalidate = "tbusername" display = "NONE" initialvalue = "Enter the user name" errormessage = "user name cannot be blank! "> </ASP: requiredfieldvalidator>
<Asp: regularexpressionvalidator id = "revname" runat = "server" controltovalidate = "tbusername" display = "NONE" errormessage = "the maximum length of the user name is 50. enter a new one. "Validationexpression =". {1, 50} "> </ASP: regularexpressionvalidator>
<Ajaxtoolkit: textboxwatermarkextender id = "wmename" runat = "server" targetcontrolid = "tbusername" watermarktext = "Enter the user name" watermark = "watermark"> </ajaxtoolkit: textboxwatermarkextender>
<Ajaxtoolkit: validatorcalloutextender id = "vcenameblank" runat = "server" targetcontrolid = "rfnameblank" highlightcssclass = "validator"> </ajaxtoolkit: validatorcalloutextender>
<Ajaxtoolkit: validatorcalloutextender id = "vcenamevalue" runat = "server" targetcontrolid = "rfnamevalue" highlightcssclass = "validator"> </ajaxtoolkit
<Ajaxtoolkit: validatorcalloutextender id = "vcenameregex" runat = "server" targetcontrolid = "revname" highlightcssclass = "validator"> </ajaxtoolkit: validatorcalloutextender>
Of course, in the code above, you can omit the validatorcalloutextender control.
Two other possible solutions
In addition to the preceding two methods, there are two possible solutions:
The first method is to use the page. Validate () method to verify the input. This method is relatively simple to implement, but it loses the original client verification function of the requiredfieldvalidator control, and triggers an unnecessary page delivery.
The second method is to use regularexpressionvalidator to replace requiredfieldvalidator, that is, to use a regular expression for verification. It is difficult to write, but the original client verification function of requiredfieldvalidator is retained, it is also a way.
