Double-click handling on the client-side using JavaScript

The main purpose of the double-click handling feature is to prevent processing the same request twice. The server-side implementation achieves this by identifying the repeated request; however, it is recommended that double-click handling be implemented using JavaScript on the client-side.

Note: Although the attribute in this reference is referred to as double-click, it is important to note that it also supports multiple-click functionality. That is, the support is not limited to exactly one additional click, but many additional clicks.

In the HTML content sent to the client that allows them to submit requests, a small validation JavaScript can be used to check whether the request has already been submitted and if so, prevent the online shopper from submitting the request again. This JavaScript validation function will check the global flag to see if the request has been submitted and, if so; does not resubmit the request. If the double-click feature is disabled on the server, it is highly recommended that the JSP and HTML pages implement this JavaScript prevention.

The following example prevents the form from being submitted more than once by using the onSubmit() action of the form object:


...
<script>
var requestSubmitted = false;
       function submitRequest() {
              if (!requestSubmitted ) {
                     requestSubmitted  = true;
                     return true;
              }
              return false;
       }
</script>
...
 
       <FORM method="POST" action="Logon"
onSubmit="javascript:submitRequest()">
              ......
       </FORM>