ASP.NET sync issues

Question

I am having a weird issue with a web form I'm working on that seems related to some async stuff going on. Basically, I need to do the following:

UserInputPanel.Visible = False
ProgressPanel.Visible = True
ResultsSet = New DataSet()
GetResults(ResultsSet)
FillOutput()
ProgressPanel.Visible = False
OutputPanel.Visible = True

This code all runs as the result of clicking a button on the WebForm. The call to GetResults(ResultsSet) is a lengthy one, thus the need to show the panel ProgressPanel. Problem is, the call to GetResults is happening before my ProgressPanel actually shows. If I comment out the call to GetResults and the lines that follow, then ProgressPanel shows up no problems. How can I force the first two lines to execute and show on the page before the call to GetResults happens?

Answer 1

It sounds like you need to use the UpdateProgress control instead of trying to trigger your own. When your form button is clicked, all the code on the server side click handler runs before any response is sent to the client.

You need something like this instead of your ProgressPanel:

 <asp:UpdateProgress ID="UpdateProgress1" runat="server">
    <ProgressTemplate>

    </ProgressTemplate>
</asp:UpdateProgress>

The contents of the ProgressTemplate will automatically be displayed whent the asynchronous postback starts, and then will hide once it is complete.

To hide the UserInputPanel, create a javascript function like the following (use jQuery or some other client-side js framework for more robust cross browser code):

function hideUserInput() {
    document.getElementById('<%=UserInputPanel.ClientID%>').style.visibility="hidden"; 
}

and attach this function to your button's OnClientClick property:

<asp:button id="YourButton"
       text="Submit"
       onclientclick="hideUserInput()"
       runat="server" onclick="YourButton_Click" />