Avoiding Multiple Submissions

Whether using a browser-supplied or a custom Submit button, we don’t want the form to be accidentally submitted multiple times.

We’ve all seen web pages that warn the visitor not to click a Submit button twice. Unfortunately, if the submission takes more than just a second or two, the visitor is left wondering if the click actually registered. At the same time, she’s afraid to click a second time—after all, she’s been warned of dire consequences if he clicks that second time. Just how long does the visitor wait in a case like this?

There are two user-friendly ways to avoid causing our visitors this kind of angst:

  1. Immediately reassure visitors with feedback that the form is in the process of being submitted, often done with some type of small animation. This is a great way, under any circumstances, of reassuring visitors that something is indeed happening.

  2. Use JavaScript to disable the Submit button after it’s clicked, thereby preventing a double submission.

    Add the following to the <form> tag:

    onsubmit="this.submitButtonName.disabled=true"

    Be aware that you might have to trace a hierarchy of path names to get to the button, if it’s embedded within other elements like a table, and that the page would need to be reloaded completely to re-enable the Submit button. Getting this to work might be a bit trickier than it appears if you’re unfamiliar with JavaScript and the Document Object Model (DOM).

Maybe you may want to share this article :

POST COMMENT

COMMENT :

You can use Textile parameters on your comments. For example: _italic_ *bold* bq. quated text "link text":URL

COMMENT PREVIEW