Multiple validation groups, only validate one on control blur

asp.netvalidation

Summary

I have a single control with two (almost) identical validators, each linked to two validation groups. When the cursor leaves the control, both validators are automatically checked by ASP.NET. Is there a way to only fire one (without setting EnableClientScript="false") so there are not two * symbols being displayed on the blur?

Details

I have a form with two buttons asp:btnSave and asp:btnSubmit… both buttons require validation, as certain controls must be validated on the save for it to work correctly.

So I have two validation groups, the "default" group for submitting (i.e. ValidationGroup property is NOT set), and the "SaveGroup" for saving. There are two asp:ValidationSummary controls to reflect these.

On a single control that is (for example) designed to accept a decimal value, I have the following. Firstly a required field for the submit, then a range validator for the submit. Then a 3rd validator which is a replication of the range validator but is part of the "SaveGroup"…

<asp:TextBox runat="server" id="txtMyDecVal" />
<asp:RequiredFieldValidator runat="server" ControlToValidate="txtMyDecVal" 
   Text="*" ErrorMessage="Enter a value" />
<asp:RangeValidator runat="server" ControlToValidate="txtMyDecVal" Type="Double"
   MinimumValue="0" MaximumValue="999.99" Text="*"
   ErrorMessage="Value must be between 0 and 999.99" />
<asp:RangeValidator runat="server" ControlToValidate="txtMyDecVal" Type="Double"
   MinimumValue="0" MaximumValue="999.99" Text="*"
   ErrorMessage="Value must be between 0 and 999.99"
   ValidationGroup="SaveGroup" />

This is working fine, and the two buttons validate correctly.

The problem is… there is a visual issue that if you type invalid text into the control, BOTH the RangeValidators are fired automatically by ASP.NET when the cursor leaves the control, resulting in two * symbols appearing.

Is there a way to make it so that only one of those validators are checked as part of the blur event on the control?

I could set EnableClientScript="false" on one of the validators, but I still want it to check the control on the client side without a post-back first.

Update

I have been playing with setting EnableClientScript="false" as I decided that the post-back on the save wasn't actually going to be a big issue.

However, this then leads on to another visual issue: Enter invalid text, the "submit" validator shows the *. Click the save, which posts-back and then displays the * for the "save" validator. If you then change the text to valid text, the "save" validator doesn't disappear, so it still looks like there's a problem… and if you change the text to different invalid text, you get the "submit" * appearing as well, resulting in the same as before… i.e. two * symbols.

Best Answer

You should add Display="Dynamic" to your validators.

<asp:RequiredFieldValidator runat="server" ControlToValidate="txtMyDecVal" 
   Text="*" ErrorMessage="Enter a value" Display="Dynamic" />
<asp:RangeValidator runat="server" ControlToValidate="txtMyDecVal" Type="Double"
   MinimumValue="0" MaximumValue="999.99" Text="*"
   ErrorMessage="Value must be between 0 and 999.99" Display="Dynamic" />
<asp:RangeValidator runat="server" ControlToValidate="txtMyDecVal" Type="Double"
   MinimumValue="0" MaximumValue="999.99" Text="*"
   ErrorMessage="Value must be between 0 and 999.99"
   ValidationGroup="SaveGroup"  Display="Dynamic"/>
Related Topic