Microsoft JScript runtime error: Sys.InvalidOperationException: Could not find UpdatePanel with ID

2 posts, 0 answers
  1. Jeremy
    Jeremy avatar
    29 posts
    Member since:
    Apr 2014

    Posted 30 Apr 2014 Link to this post

    I'm new to Telerik controls and ajax as a whole so please forgive my ignorance.  I've done a lot of searching on this error but the solutions I have found don't quite seem to fit my situation.

    I have a complicated scenario and I'm only involved in a piece of it.  My usercontrol is being called by another developer's aspx page so I'm limited to what I can do on the page itself.

    The aspx page has a RadGrid (rgDetails), each row of rgDetails has a RadMultiPage (RadMultiPage1). 

    Now here's where my usercontrols comes in.  One RadPageView in RadMultiPage1 contains my ucNoteTab.ascx which has a RadMultiPage (NotesMultiPage) control on it.  The each RadPageView in NotesMultiPage contains my final usercontrol (ucNotePreview.ascx).  It is in ucNotePreview that I'm having the trouble.  ucNotePreview has a textbox and a few buttons that change the properties and content of the textbox.

    Here's the problem:  I can't do a postback to the server...there are too many pageloads that stuff gets too messed up.  I need to us an ajax update panel and trigger the button click events inside that so the buttons can work their magic on the textbox without a postback.  However, I get a "Microsoft JScript runtime error: Sys.InvalidOperationException: Could not find UpdatePanel with ID" error when I try to implement asp:UpdatePanel on ucNotePreview.

    Here's a diagram of the heirarchy of the controls if that helps:
    Details.aspx (developed by another programmer)
    -> RadGrid (rgDetails) 
    --> RadMultiPage (RadMultiPage1)
    ---> ucNoteTab.ascx   (Start of my code)
    ----> RadMultiPage (NotesMultiPage)
    -----> ucNotePreview.ascx
    ------> UpdatePanel (NotePreviewUpdatePanel)
    -------->  Here's where it fails 

    I'm sorry I can't really post code because it's all over the place and hard to summarize.  Any thoughts based on this convoluted description?
  2. Marin Bratanov
    Marin Bratanov avatar
    3564 posts

    Posted 05 May 2014 Link to this post

    Hi Jeremy,

    Even adding asp:UpdatePanel or other form of AJAX setup, a postback is still a postback. The page will go through its entire lifecycle on the server as if it were a normal postback without AJAX. The only difference is that with AJAX only a part of the page is sent in the response. Thus, if there are problems with full postback, they will continue to exits with partial postbacks, but will likely be masked by the partial rendering. Thus, I would advise that you make sure the page's logic is OK and add AJAX only then.

    As to the error itself - such an exception is usually thrown when there are nested update panels. Here is a simple walkthrough of a problematic case:

    1. there is an update panel and somewhere in it - another update panel (or AjaxSettings in a RadAjaxManager/RadAjaxManagerProxy, or RadAjaxPanel, it does not matter)
    2. a postback occurs and response is streamed to the client
    3. the first update panel in the response disposes its innerHTML and would start replacing it with what the server sent
    4. the second update panel also attempts to dispose its contents, but since it was already disposed by the first update panel, the MS AJAX scripts cannot find it, so they throw an exception

    To avoid this, you should avoid nesting UpdatePanels. If the grid is already in an update panel, you may not need add any more. Also, setting their UpdateMode to Conditional helps because they will dispose more rarely, so if the parent update panel manages to detect the postback comes from the child it may not dispose and cause the error. Thus, this is the second suggestion I can give you.

    To summarize:

    1. look into removing nested update panels as they may not be needed anyway. Perhaps the smallest update panel in ucNotePreview is not needed.
    2. look into setting UpdateMode to conditional if possible. Try setting it to the update panel in ucNotePreview and to the update panels higher in the hierarchy.

    I hope this helps.


    Marin Bratanov

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

  3. DevCraft R3 2016 release webinar banner
Back to Top