Image button and update panel

Question

I have a Image button defined as follow,

<div>
    <asp:ImageButton ID="btn1" runat="server" ImageUrl="/_LAYOUTS/1033/IMAGES/row.png" />
</div>
<div>
    <asp:RequiredFieldValidator runat="server" ID="reqName" ControlToValidate="txtUserEmail" validationGroup="Page"
        ErrorMessage="enter a email" />
    <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ValidationExpression="^([\w\.\-]+)@([\w\-]+)((\.(\w){2,3})+)$"
        ControlToValidate="txtUserEmail" ErrorMessage="enter a email">  
    </asp:RegularExpressionValidator>
</div>

Now somewhere I got update panel,

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <div> // with controls in it that do some calculations without post back

Problem is when my user control loads up, if I try to calculate and press a button in update panel, it checks if text box is empty or not, if it then gives enter a email error which shouldn't be happening.

Now If I add validationGroup="Page" to validators it does work but it then doesn't check if email text box is empty or not.

Also if I add EnableClientScript=False then again update panel works but doesn't seems to validate email text box.

Answer 1

If you add ValidationGroup="Page" to your validators, you also need to add it to the relevant button(s) and input control(s) otherwise the validators will be in a group on their own with nothing to validate.

<div>
    <asp:ImageButton ID="btn1" runat="server" ImageUrl="/_LAYOUTS/1033/IMAGES/row.png" ValidationGroup="Page" />
</div>
<div>
    <asp:RequiredFieldValidator runat="server" ID="reqName" ControlToValidate="txtUserEmail" ValidationGroup="Page" ErrorMessage="enter a email" />
    <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ValidationExpression="^([\w\.\-]+)@([\w\-]+)((\.(\w){2,3})+)$" ControlToValidate="txtUserEmail" ValidationGroup="Page" ErrorMessage="enter a email" />
</div>