Could not find UpdatePanel with ID 'xxx'. If it is being updated dynamically then it must be inside another UpdatePanel

Question

I have a page with Ajax Tab controls, within one of the tabs is a webcontrol that as a Telerik RadGrid, with Edit forms pointing to another web control. That edit form also contains Ajax Tabs and on one of those tabs, there is an Ajax modal popup of yet another webcontrol.

The initial webcontrol works fine when used on its own page, but the edit form fails to appear when the control is used within the Ajax Tabs as desired. The script manager is throwing the following error:

Microsoft JScript runtime error: Sys.InvalidOperationException: Could not find UpdatePanel with ID 'xxx'. If it is being updated dynamically then it must be inside another UpdatePanel.

Any assistance with this would be appreciated.

Paleo

Answer 1

This issue occurs in Telerik RadAjaxManager when you adds invisible controls to it.

So in case of your in need to show/hide AJAX controls, it is recommended to add AJAX settings grammatically from you code behind (based on control visibility state) instead of ASPX code.

For more information: Please check this answer on the Telerik forums.

Chimerical

Answer 2

Well, I am considering this error is coming in your script. If you are showing/hiding the update panel then it will give this error. The best solution is known to me which worked too is put your update panel into the content template of the other update panel which will be the parent of the update panel that you are showing/hiding.

<asp:UpdatePanel ID="Panel1" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:UpdatePanel ID="Panel2" runat="server" UpdateMode="Conditional">
             <ContentTemplate>
                 <asp:Label ID="labwl1" runat="server" Text="Label">
                 </asp:Label>
             </ContentTemplate>
        </asp:UpdatePanel >
    </ContentTemplate>
</asp:UpdatePanel >

Now if you will hide the update panel with id Panel2 it won't give any error.

Civic

Answer 3

In most of the cases - If container/Parent of that update panel is trRow and you have somewhere in code like trRow.Visible = false; then It wont find said updatepanel and throw error.

Gert

Answer 4

To start off with the troubleshooting, I personally will try to remove parts of the code and thus designate the reason for the error. For example, remove the grid and load the user control dynamically on tab click to see if the problem remains, then remove the inner ajax tab or the modal popup and perform another check, etc.

Pryce

Answer 5

That is correct, I've wasted 2 hrs to find out why all of the sudden my code stopped working...

turned out I've been a bit cleaning a bit too much of my rem'ed code out and removed a closing in my update panel...

<asp:UpdatePanel ID="submitupdatepanel" runat="server">
    <ContentTemplate>
        <div class="block" style="height: 60px; width: 400px;">
            <div class="centered">
                <asp:LinkButton ID="submitbutton" runat="server" CssClass="button_red2 " Text=" <span>Submit </span>">
                </asp:LinkButton>
                <asp:LinkButton ID="cancelbutton" runat="server" CssClass="button_gray2 " Text=" <span>Cancel</span>" Visible="false" OnClientClick="window.close()">
                </asp:LinkButton>
            </div>
          </ContentTemplate>
</asp:UpdatePanel>
<br />
<div style='display: none'>
    <asp:UpdatePanel runat="server">
        <ContentTemplate>
            <asp:PlaceHolder ID="myhiddenpopups2" runat="server" Visible="true"></asp:PlaceHolder>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

which then gave this same error on the hidden updatepanel part below it.

After i put the missing back in, al went back to normal status

<asp:UpdatePanel ID="submitupdatepanel" runat="server">
    <ContentTemplate>
        <div class="block" style="height: 60px; width: 400px;">
            <div class="centered">
                <asp:LinkButton ID="submitbutton" runat="server" CssClass="button_red2 " Text=" <span>Submit </span>">
                </asp:LinkButton>
                <asp:LinkButton ID="cancelbutton" runat="server" CssClass="button_gray2 " Text=" <span>Cancel</span>" Visible="false" OnClientClick="window.close()">
                </asp:LinkButton>
            </div>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>
<br />
<div style='display: none'>
    <asp:UpdatePanel runat="server">
        <ContentTemplate>
            <asp:PlaceHolder ID="myhiddenpopups2" runat="server" Visible="true"></asp:PlaceHolder>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

Hope it helps for someone. K

Harquebusier

Answer 6

In my case I had 2 update panels on the page, but only 1 of them had an ID. Setting an ID for the other one resolved the error.

Timbuktu

Answer 7

I resolved the issue by removing the UpdatePanel on the initial tab that contained the WebControl. I'm not clear on why this should have caused the issue though so if anyone can explain that, I'd be interested to find out.

So, for example, I originally had this:

<cc1:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" OnClientActiveTabChanged="TabContainer1_OnChanged"  Visible="true"  >
     <cc1:TabPanel runat="server" ID="TabPriorities">
           <HeaderTemplate>Manage Prioritys</HeaderTemplate>
           <ContentTemplate>
                 <asp:UpdatePanel ID="UpdatePanelPriorities" runat="server" UpdateMode="Conditional">
                   <ContentTemplate>
                      <uc1:PriorityGrid ID="PriorityGrid1" runat="server" />
                   </ContentTemplate>
                 </asp:UpdatePanel>
            </ContentTemplate>
      </cc1:TabPanel>

And I changed it to:

<cc1:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" OnClientActiveTabChanged="TabContainer1_OnChanged"  Visible="true"  >
     <cc1:TabPanel runat="server" ID="TabPriorities">
           <HeaderTemplate>Manage Prioritys</HeaderTemplate>
           <ContentTemplate>

                      <uc1:PriorityGrid ID="PriorityGrid1" runat="server" />

            </ContentTemplate>
      </cc1:TabPanel>

And that resolved the script error coming out of the user control which also contained ajax tabs and a modal popup.

Paleo

Answer 8

This can be caused by unclosed tag or missing end tag.

Javier

Answer 9

My page contains a few updatepanels. I fixed this error by making sure all of them were visible and didn't have display:none.

You can find which panel is causing the error by viewing the source of the page and searching for the ID the error is giving you.

Appreciation

Yes, attempting to update a panel with Visible = false also results in this error. – Honora

Answer 10

EDIT: I'd like to revise my answer based on some new things I discovered while working with update panels in UpdateMode="Conditional".

This is still in context of addressing the OP's issue of encountering the above error.

The scenario for me is that I have a parent update panel with several nested child update panels:

    <asp:UpdatePanel ID="upParent" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <%-- Header Content --%>
            <asp:UpdatePanel ID="upChild1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <%-- Child1 Content --%>
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:UpdatePanel ID="upChild2" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <%-- Child2 Content --%>
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:Button ID="btnEditMode" runat="server" Text="Edit" OnClick="btnEditMode_Click"></asp:Button>
        </ContentTemplate>
    </asp:UpdatePanel>

In order for the Edit button to change content in both child update panels and also refresh the overall Parent update panel without causing any issues, you might want to consider doing an asynchronous postback:

    <asp:UpdatePanel ID="upParent" runat="server" UpdateMode="Conditional">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnEditMode" EventName="Click" />
        </Triggers>
        <ContentTemplate>
            <%-- Header Content --%>
            <asp:UpdatePanel ID="upChild1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <%-- Child1 Content --%>
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:UpdatePanel ID="upChild2" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <%-- Child2 Content --%>
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:Button ID="btnEditMode" runat="server" Text="Edit" OnClick="btnEditMode_Click"></asp:Button>
        </ContentTemplate>
    </asp:UpdatePanel>

This works for me, I don't get the above mentioned (OP's) error any longer. Interestingly enough, almost similar to the OP's scenario, I've been working with Ajax Tab Controls and each tab contained child update panels. This is where I've encountered the exact same error message and resolved it by adding the asynchronous post back trigger.

Ochrea

Needless to mention, you'll need to call something like upParent.Update() in the OnClick event handler of the edit button to refresh the contents, since it's Update Mode is Conditional. – Ochrea