Triggering an ASP.NET AJAX UpdatePanel refresh with JavaScript

1 posts, 0 answers
  1. Hristo Deshev
    Hristo Deshev avatar
    16 posts
    Member since:
    May 2004

    Posted 08 Feb 2007 Link to this post


    r.a.d.controls version Q4 2006
    .NET version ASP.NET 2.0 + ASP.NET AJAX
    Visual Studio version

    programming language

    C# + JavaScript
    browser support

    all browsers supported by r.a.d.controls

    Sometimes we need to trigger an UpdatePanel update from custom JavaScript, most often in a DOM event handler. For example we may want to refresh a RadGrid control, so that new data gets displayed to the user.

    We can use a regular __doPostBack() function call to that while passing the grid unique ID. ASP.NET AJAX's PageRequestManager object will detect that and turn it into an Ajax request coming from the grid inside the UpdatePanel. This will update the panel if we have the ChildrenAsTriggers property set to true (this is the default).

            <script type="text/javascript"
            function pageLoad() 
                $addHandler($get("postBackButton"), "click", Function.createDelegate(null, GridPostBack)); 
            function GridPostBack() 
                __doPostBack('<%=RadGrid1.UniqueID %>'"customPostback"); 

    We will have to override the RaisePostBackEvent page method on the server to intercept our custom postback and do something of value:

        protected override void RaisePostBackEvent(IPostBackEventHandler sourceControl, string eventArgument) 
            //is this our own custom postback? if not, let the base implementation handle it 
            if (eventArgument == "customPostback"
                ScriptManager.RegisterStartupScript(Page, Page.GetType(), "customPostBack""Sys.Debug.trace('customPostBack')"true); 
                base.RaisePostBackEvent(sourceControl, eventArgument); 
Back to Top