Stop Duplicate Form Submissions with Progress Buttons

by on 12/16/13 at 8:10 pm

Imagine a user placing an order on an e-commerce website. They get to the checkout page and accidentally click the “order” button twice. Now they just got billed twice for the same order. They contact the merchant to correct this, but they are not happy. The merchant isn’t happy either because they have to take the time to find the duplicate transaction, issue credit back to the user and pay the extra processing fee that incurs when processing transactions. This situation is all too common in the world of online payments. You can avoid this mess by using a progress button for their “order” button.

Progress Buttons Prevent Duplicate Orders

Websites can’t change the clicking habits of users. But they can change what happens when users double-click the “order” button. Progress buttons prevent duplicate orders by disabling the button after the first click, and displaying a progress bar that tells users that their order is processing. Users get clear and immediate feedback after their first click, so they won’t feel the need to click the button again. Double-clicking the progress button won’t affect a user’s purchase order.


Progress Button Tutorials

Users Double-Click Form Buttons

There are many reasons users double-click form buttons. Some website pages load slow after the first click. As the page loads, the user is unsure whether their click registered, so they’ll click the button again to make sure. When users don’t get a clear sign that the page is loading and they see the same page, they’ll click the form button again to get the feedback they were expecting. By that time, they’ll have already submitted the form more than once.


Research also shows that many older users (aged 50+) have a habit of double-clicking form buttons online. This not only leads to duplicate orders, but duplicate “add to cart” actions. This can cause complaints when users end up spending more money than expected. Older users have the most trouble using websites. It’s important for e-commerce websites to accommodate their clicking habits when they shop online.

Stop Duplicate Form Submissions

Duplicate form submissions don’t just happen on e-commerce websites. They can happen when users pay bills online, send messages, upload photos and anywhere there’s a form button that’s not double-click proof. No user wants to get double charged for an order, overpay their bills, spam their messages or post the same photo twice. It’s up to you to prevent duplicate form submissions from happening on your site. Save yourself and users the hassle and frustration, and put a progress button on your form.


Light Resume Light Freelancer Wireframe Sheets Wireframe Patterns Flow Patterns

Author and editor-in-chief of UX Movement. Loves great web experiences and fights for the user.

Leave a Comment