Validation group being called by all buttons

Question

I have a simple 2 tab panel setup with 2 validation groups. My problem is that my buttons fire both validation groups.

<cc1:TabPanel ID="TP2" runat="server" HeaderText="" Enabled="true">
 <HeaderTemplate>Loan Main</HeaderTemplate>
  <ContentTemplate>
    <table cellpadding="3" cellspacing="1">
      <tr>
        <td style="text-align: right"> Quality:</td>
        <td><asp:DropDownList ID="ddlAssignedRep" runat="server" DataSourceID="SqlDataSourceAssignedRep" 
                 ValidationGroup="TP2" DataTextField="CreatedBy" DataValueField="CreatedBySFID" 
                AppendDataBoundItems="True"> </asp:DropDownList>
          <asp:SqlDataSource ID="SqlDataSourceAssignedRep" runat="server" ConnectionString="<%$ ConnectionStrings:EUCNET00720 %>" 
        SelectCommand="SELECT distinct [CreatedBySFID], [CreatedBy] FROM [tblRefiActions] WHERE ([RefiPkey] = @RefiPkey) ORDER BY [CreatedBy]">
            <SelectParameters>
              <asp:QueryStringParameter Name="RefiPkey" QueryStringField="Pkey" Type="Int32" />
            </SelectParameters>
          </asp:SqlDataSource></td>
      </tr>
      <tr>
        <td style="text-align: right"><asp:Button ID="btnSave" runat="server" ValidationGroup="TP2" Text="Save" /></td>
        <td>&nbsp;</td>
      </tr>
    </table>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Quality measure is required." 
    ValidationGroup="TP2" ControlToValidate="ddlQuality" Display="None" SetFocusOnError="True"></asp:RequiredFieldValidator>
  </ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="TP3" runat="server" HeaderText="" Enabled="true">
  <HeaderTemplate>Short Payoff</HeaderTemplate>
  <ContentTemplate>
    <table cellpadding="3" cellspacing="1">
      <tr>
        <td style="text-align: right"> Amount Short:</td>
        <td><asp:TextBox ID="txtShortPayoffAmount" ValidationGroup="TP3" runat="server" Columns="12" MaxLength="12"></asp:TextBox></td>
      </tr>
      <tr>
        <td style="text-align: right">&nbsp;</td>
        <td><asp:Button ID="btnPayoffUpdate" runat="server" Text="Update" ValidationGroup="TP3" /></td>
      </tr>
    </table>
    <br />
    <br />
    <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" 
    ErrorMessage="Amount can only contain numbers and a single decimal point." ControlToValidate="txtShortPayoffAmount" 
    ValidationGroup="TP3" Display="None"  SetFocusOnError="True"
    ValidationExpression="^(\d{1,3}(\,\d{3})*|(\d+))(\.\d{2})?$"> </asp:RegularExpressionValidator>
  </ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" DisplayMode="List" ShowMessageBox="True" 
     ValidationGroup="TP2" ShowSummary="False" />
<asp:ValidationSummary ID="ValidationSummary2" runat="server" DisplayMode="List" 
     ValidationGroup="TP3" ShowMessageBox="True" ShowSummary="False" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
  <ContentTemplate>
    <div>
      <cc1:ModalPopupExtender ID="ProgressBarModalPopupExtender" runat="server" BackgroundCssClass="ModalBackground" BehaviorID="ProgressBarModalPopupExtender" TargetControlID="hiddenField1" PopupControlID="Panel1" />
      <asp:Panel ID="Panel1" runat="server" Style="display: none; background-color: #C0C0C0;"> <img id="MyImage" src="../Images/Vista_Searching_Bar.gif" alt="" />
        <div id="processMessage" style="width: 200px;"> <br />
          <br />
          &nbsp;&nbsp; Loading...<br />
          <br />
        </div>
      </asp:Panel>
      <asp:HiddenField ID="HiddenField1" runat="server" />
    </div>
  </ContentTemplate>
</asp:UpdatePanel>
<script type="text/javascript">

         function StartProgressBar() {
            var tp2 = Page_ClientValidate("TP2")
            if (tp2 == true) {
                 var myExtender = $find(    ProgressBarModalPopupExtender    );
                 ProgressImg = document.getElementById(    MyImage    );
                 setTimeout("ProgressImg.src = ProgressImg.src", 10);
                 myExtender.show();
                 return true;
             }
         }

    </script>

Answer 1

I think your validation group names are off. The button and validation summary say the validation group "TabPanel3" "TabPanel1" but your validators say "TP3" and "TP2"

Also you need to make sure that the javascript in your button click is having the ValidationGroup passed in. It looks as though right now it is calling "TP2" no matter which button you click based on your comments below.

Try this for your javascript

 function StartProgressBar(ValidationGroup) {
        if (Page_ClientValidate(ValidationGroup)) {
            //do stuff here on valid

            return true;
        }
        else {
            return false;
        }
    }

Then your button click code should be something like this:

<asp:Button ID="btnSave" OnClientClick="return StartProgressBar('TP2');" runat="server" ValidationGroup="TP2" Text="Save" />

and 

<asp:Button ID="btnPayoffUpdate" OnClientClick="return StartProgressBar('TP3');" runat="server" Text="Update" ValidationGroup="TP3" />

Make each click return the value of the validation, that way the click will not continue, because if you return true from that function even if the validation fails I am not sure it will stop since you called the validation manually, I don't know if it will run again. But if you return false it will stop the click, or at least it should.