ASP.Net Multiple update panels updating when they are not supposed to

Question

I have some Update Panels on a webpage all set to UpdateMode="Conditional", however when the AsyncPostBackTrigger on one of the Update Panels is triggered, all of the Update Panels refresh.

The following is one of the update panel HTML markup:

<asp:UpdatePanel ID="pnls1FieldUpdate" runat="server" 
                 UpdateMode="Conditional">
    <ContentTemplate>
        <table class="FillInGrid" cellpadding="0" cellspacing="0">
            <tr>
                <td>
                    <asp:TextBox ID="txtS1ExpDate" runat="server" Width="67px" TabIndex="14"></asp:TextBox>
                    <asp:ImageButton ID="cmdS1ExpDate" runat="server" 
                         ImageUrl="~/images/calendar.png" TabIndex="15" />
                    <asp:CalendarExtender ID="CalendarExtender6" runat="server" TargetControlID="txtS1ExpDate" PopupButtonID="cmdS1ExpDate" Format="dd/MM/yyyy">
                    </asp:CalendarExtender>
                </td>
                <td>
                    <asp:DropDownList ID="cboS1ExpenseItem" runat="server" Width="200px" 
                        onselectedindexchanged="cboS1ExpenseItem_SelectedIndexChanged" 
                        AutoPostBack="True" TabIndex="16">
                    </asp:DropDownList>
                </td>
                <td>
                    <asp:TextBox ID="txtS1ExpAmt" runat="server" Width="78px" ontextchanged="txtS1ExpAmt_TextChanged" TabIndex="18" AutoPostBack="True"></asp:TextBox>
                </td>
                <td>
                    <asp:TextBox ID="txtS1ExpGST" runat="server" Width="78px" TabIndex="19"></asp:TextBox>
                </td>
                <td>
                <asp:TextBox ID="txtS1ExpOC" runat="server" Width="78px" 
                        ontextchanged="txtS1ExpOC_TextChanged" TabIndex="20" AutoPostBack="True"></asp:TextBox>
                </td>
                <td>
                    <asp:Button ID="cmdAddSection1Exp" runat="server" Text="Add" Width="80px" 
                        onclick="cmdAddSection1Exp_Click" TabIndex="21" /></td>
            </tr>
            <tr>
                <td colspan="6">
                    <table>
                        <tr>
                            <td class="HdrGnrl tRt" style="width:105px;">Sub item</td>
                            <td style="width:220px;">
                                <asp:DropDownList ID="cboS1ExpenseSubItem" runat="server" Width="200px" 
                                    TabIndex="17">
                                </asp:DropDownList>
                            </td>
                            <td style="width:85px;"></td>
                            <td style="width:85px;"></td>
                            <td style="width:85px;"></td>
                            <td style="width:100px;"></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="txtS1ExpAmt" EventName="TextChanged" />
        <asp:AsyncPostBackTrigger ControlID="txtS1ExpOC" EventName="TextChanged" />
        <asp:AsyncPostBackTrigger ControlID="cboS1ExpenseItem" EventName="SelectedIndexChanged" />
    </Triggers>
</asp:UpdatePanel>
<asp:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender4" TargetControlID="pnls1FieldUpdate" runat="server">
    <Animations>
        <OnUpdating>
            <Sequence>
                <FadeOut AnimationTarget="pnlExpense" minimumOpacity=".2" />
            </Sequence>
        </OnUpdating>
        <OnUpdated>
            <Sequence>
                <FadeIn AnimationTarget="pnlExpense" minimumOpacity=".2" />
            </Sequence>
        </OnUpdated>
    </Animations>
</asp:UpdatePanelAnimationExtender>

Why are all of the updatepanels updating when they shouldnt?

Answer 1

Within the code you post, there is only one UpdatePanel.

However, please note than the ChildrenAsTriggers Property is set to true by default, so a AsyncPostBackTrigger will be added automatically for every control that is inside the UpdatePanel. So first thing I would try is to set it to false :

<asp:UpdatePanel ID="pnls1FieldUpdate" 
                 runat="server" 
                 UpdateMode="Conditional"
                 ChildrenAsTriggers="false" >