Question

I have some processing that can take up to 5+ seconds the first time the page is loaded on the server. This is an external constraint that’s beyond my control and since it’s happening in a WebPart that can be added to any page on servers that are outside of my control, I can’t do this processing at a larger scope such as the application.

I’d like the page to show progress while a partial postback happens in an updatepanel instead of the user waiting for the page to load before seeing anything at all. The code behind that postback will do the busy work.

I’ve tried using an ajax timer which works well except when there’s an exception thrown in the code behind the postback.

In summary I would like to know how to perform a partial postback once and only once as soon as the page loads on the client.

Answer 1

I figured this out. To partial postback to the server via an UpdatePanel without using hidden controls, do this with jQuery:

<script type="text/javascript">
    $(document).ready(function () {
        __doPostBack('<%=UpdatePanel1.ClientID %>');
    });
</script>

This will perform a partial postback to the server against the UpdatePanel with the ID UpdatePanel1 as soon as the HTML DOM is ready. You can then use the ASP.NET page life cycle to hook into whatever event is appropriate for you. I hooked into the load event of the update panel:

protected void UpdatePanel1_Load(object sender, EventArgs e)
{
    if (Page.IsPostBack && Session["InitializedKey"] == null)
    {
        Session["InitializedKey"] = true;
        // do your initialization stuff here
    }
}

The code above will only run if the page is posting back and the session variable is set. Now you have to clear the session variable when the user refreshes the page since the intent here is to run this code on the first postback and only the first postback. So clear the session variable in the Page_Load:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
        Session[initializedKey] = null;
}

And if you want to show a progress indicator while the page is in partial postback, do this javascript:

<script type="text/javascript">
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_beginRequest(BeginRequestHandler);
    prm.add_endRequest(EndRequestHandler);
    function BeginRequestHandler(sender, args) {
        if (args._postBackElement.id == '<%=UpdatePanel1.ClientID %>') {
            $get('Progress').className = 'Progress';
        }
    }
    function EndRequestHandler(sender, args) {
        if (sender._postBackSettings.sourceElement.id == '<%=UpdatePanel1.ClientID %>') {
            $get('Progress').className = 'Hidden';
        }
    }
</script>

This requires a div tag with the id ‘Progress’ and whatever you want to show for progress within that div. You also need some css to set the display and visible styles on the div tag in classes named Hidden and Progress. Don’t forget to perform error handling on partial postbacks!