Hide Panel as soon as button is clicked.

  • Thread starter Thread starter TheDude5B
  • Start date Start date
T

TheDude5B

Hi,

I have one .net page which processes a form and then displays the
result. The coding which takes place in order to process the form
takes a while so I want to have some sort of display to the user.

So what I want is that as soon as the button has been clicked, the
Panel holding the form is hidden and then another panel is shown with
a gif image that looks like a loading image.

Just now when I want to do this, the code has to complete before the
Panel is hidden.

Thanks
 
Howdy,

Example:

<asp:Panel runat="server" ID="processingPanel" Style="position:absolute;
width:300px;display:none">
Processing...<img />
</asp:Panel>

<asp:Panel runat="server" ID="formPanel">
<asp:TextBox runat="server" ID="txtSomeData"/>
<asp:Button runat="server" ID="btnProcess"
OnClientClick="ShowProcessingPanel()"
Text="Process" OnClick="btnProcess_Click"/>
</asp:Panel>

<script type="text/javascript">
<!--
function ShowProcessingPanel()
{
var formPanel = document.getElementById('<%=formPanel.ClientID %>');
var processingPanel = document.getElementById('<%=processingPanel.ClientID
%>');

formPanel.style.display = 'none';
processingPanel.style.display = 'block';

return true;
}
//-->
</script>

<script runat="server">
protected void btnProcess_Click(object sender, EventArgs e)
{
// simulate long processing on the server
System.Threading.Thread.Sleep(500);
}
</script>
 
Back
Top