Once a user has submitted a form, you generally don’t want them to submit it a second time.1 A nice way to handle this is to disable the submit button once the form has been submitted, while replacing the text in the submit button with a message to let the user know that their desired action has been taken.
Here is a little code that will disable the submit button and display that nice message:
And here is a JS Fiddle to play around with.
Set the message to display by setting a data attribute on the submit button. If the data attribute isn’t set, we don’t do anything. This is a good safeguard against unexpected functionality, but if you want to disable the button for all forms anyway you can do so with a little code tweak.
- Some folks insist on double-clicking on the web. ↩