Tuesday, July 08, 2008

Hide Submit button to prevent double click using JavaScript in .NET

Here is snippet of JavaScript to hide the submit button to prevent users from double-clicking on the button multiple times causing several server requests.

What I like to do is hide the submit button and show a message to notify the user that the action is in progress.

This is my front-end code. I have an image button that OnClick is submits an order.

<asp:ImageButton ID="btnPlaceOrder" runat="server" Visible="False" OnClick="btnPlaceOrder_Click" />
<div id="process_message" style="display:none;">
<p> Processing your order...</p>

The code-behind looks like this:

btnPlaceOrder.Attributes.Add("onclick", "this.disabled = true;this.hide(); $('process_message').show();" + ClientScript.GetPostBackEventReference(btnPlaceOrder, null) + ";");

No comments:

Post a Comment