Preventing Duplicate Submissions in Oracle APEX with a Custom Plugin

Posted by on

 


Submitting forms multiple times by accident is a common problem in web applications. In Oracle APEX, users may click a submit button multiple times due to network delays or slow page responses, which can lead to duplicate entries in your database, errors, or unintended side effects.

In this blog post, I will show you how to build a custom Dynamic Action plugin in Oracle APEX that prevents duplicate submissions and enhances user experience, using a simple and flexible JavaScript approach.

Why Duplicate Submissions Are a Problem

Duplicate submissions can cause:

  • Duplicate records in the database

  • Unexpected calculations or triggers firing multiple times

  • User frustration, if they see errors or multiple confirmation messages

  • Security concerns, especially in payment forms or critical operations

While Oracle APEX handles some validations on the server-side, client-side prevention improves both performance and UX.


Solution Overview

We will create a plugin that:

  1. Disables the submit button after it is clicked

  2. Submits the page using APEX’s apex.submit() function

  3. Optionally re-enables the button after a configurable delay

  4. Works with any button using its Static ID

The solution is lightweight, flexible, and integrates seamlessly with Dynamic Actions.

Step 1: JavaScript Function

Here’s the JavaScript function that powers our plugin:


     How It Works

  • The function takes two parameters:

    1. buttonId – the Static ID of the submit button

    2. disableSeconds – optional time in seconds to keep the button disabled

  • It prevents multiple clicks by disabling the button immediately after the first click

  • Uses APEX’s apex.submit() to trigger a normal submission

  • Optionally re-enables the button after the specified delay if the page hasn’t reloaded

Step 2: Create the Plugin Render Function

The plugin’s PL/SQL render function connects the Dynamic Action with the JavaScript:

Step 3: Using the Plugin in APEX

  1. Upload your JS file (restrict_duplicate_submit_js.js) to the plugin’s files

  2. Add a Dynamic Action to your submit button

  3. Select the plugin as the Action

  4. Set the Attributes:

    • Attribute 01 → Button Static ID (e.g., CHECK)

    • Attribute 02 → Disable time in seconds (e.g., 2)

  5. Save and test the page

Sample Video:



Benefits of This Approach

  • Works with any button dynamically

  • Prevents duplicate submissions without affecting server-side logic

  • Lightweight and flexible for APEX applications

Conclusion

With this plugin, you can easily prevent users from submitting the same form multiple times, improving data integrity and user experience.

This is a small but powerful addition to any Oracle APEX application, especially for critical forms, financial transactions, or long-running processes.

Try it in your next project and see the difference!








Comments

Post a Comment