Preventing Multiple Submits On An ATG Form

Home/Java/ATG/Preventing Multiple Submits On An ATG Form

Often, you’ll want to prevent impatient users from clicking a submit button multiple times, as you can end up with multiple actions taking place, or object state can get in a bad way leading to errors. For this example we’ll assume you have a final Submit Order form that actually places the order, auth’s the credit card, etc…

You can’t simply disable the submit button onclick with ATG as typically the submit button is the input field that actually activates the handle method. I tried a bunch of things, before I was able to get something working, so I wanted to share that here.

First thing is to write some javascript that will handle all of the magic (this example uses jQuery):

<script language=”JavaScript”>function submitform(){$(‘#commitOrderButton’).attr(“href”,”#”);document.myFormsName.submit();}</script>

Second, you need to move the input that calls the correct handle method out of the submit button and into a hidden form field:

<dsp:input bean=”CommitOrderFormHandler.commitOrder” value=”submit” type=”hidden”>
</dsp:input>

Thirdly you’ll want to replace the submit input with a submit <a> which will call your javascript:

<a href="javascript:submitform()" id="commitOrderButton">
 <img src="/myapp/img/button/submitOrder.gif" alt="Submit Order" border="0" class="submitOrder" />
</a>

And that’s it.

By | 2017-05-18T15:17:13+00:00 October 10th, 2008|ATG|4 Comments

About the Author:

4 Comments

  1. Brett Wilson October 24, 2008 at 12:18 pm - Reply

    Would you not recommend using the synchronized attribute of the dsp:form tag instead?

  2. Devon October 24, 2008 at 12:28 pm - Reply

    Brett:

    the synchronized attribute is for managing form submissions to session and global components, preventing multiple form submissions from hitting the component at the same time.

    It doesn’t solve the problem of multiple submit clicks on a request scoped form handler, as each click can create a new request scope.

    At least that’s my understanding.

    Devon

  3. gux December 22, 2008 at 10:15 am - Reply

    But if you do that, if the user has javascript turned off, the form is not submitted at all (and that’s not a rare case, with Firefox plugins like “NoScript”).

    I would complement it with a <noscript> block:
    <noscript>
    <dsp:input bean=”CommitOrderFormHandler.commitOrder” type=”img” src=”/myapp/img/button/submitOrder.gif” />
    </noscript>

    regards,
    Gustavo

  4. Devon December 22, 2008 at 10:22 am - Reply

    Very good point!!!

    I’m used to sites which require JS to perform most of the site actions.

Leave A Comment