How do I prevent users clicking a button twice?

Question

I have an old ASP.NET web forms application (.NET 2.0) that has a process that takes 30 seconds or so to run when a button is clicked. I need to prevent the button from being clicked twice. This will prevent posting twice, which causes duplicate data in a database.

I tried adding;

OnClientClick="this.disabled='true';" 

to try to disable the button in JavaScript. However, though the button becomes disabled, the postback for the button then doesn't work.

Disabling the button to prevent multiple submissions is the ideal for this application. How can I do this?

EDIT

I am unable to use third-party controls.

Answer 1

If you simply disable the button then ASP.NET won't post the form. Also you want to deal with client-side validation. Here's my solution:

<asp:Button runat="server" ID="btnSave"     Text="Save" OnClick="btnSave_Click"     OnClientClick="if (!Page_ClientValidate()){ return false; } this.disabled = true; this.value = 'Saving...';"     UseSubmitBehavior="false" /> 

See @Dave Ward's post for a description of UseSubmitBehavior.

If you have multiple validation groups you'll need to enhance this solution for that.