Preventing Duplicate Success Messages After Page Reload in Oracle APEX using JavaScript

Introduction:-

In Oracle APEX (Application Express), preventing duplicate success messages after a page reload is crucial for delivering a smooth and user-friendly experience. In older versions of APEX, a common issue occurs where success messages reappear when users refresh the page either by pressing “F5” or clicking the browser’s refresh button. This happens because the URL retains the `success_msg` parameter, causing the notification to trigger repeatedly on each reload. To resolve this, developers can use JavaScript and dynamic actions to remove the `success_msg` parameter from the URL. By implementing a JavaScript function to handle this and executing it on page load, success messages are displayed only once, enhancing the overall usability and professionalism of the application.

The following technologies has been used to achieve the same.

• Oracle APEX
• JavaScript

Why we need to do:-

Preventing Duplicate Success Messages After Page Reload in Oracle APEX using JS.

In an Oracle APEX application, when a user completes a form submission or a process, a success message is displayed to confirm the successful action. However, if the user refreshes the page—by pressing **F5** or clicking the browser’s refresh button—the success message appears again. This happens because the URL still contains the `success_msg` parameter, which continues to trigger the message on every reload. This repeated display can confuse users, making them think the action was executed multiple times. By implementing a JavaScript function to remove the `success_msg` parameter and executing it on page load, the application ensures that the success message is shown only once. This approach improves the user experience by providing clear feedback and maintaining a clean and professional interface.

How do we solve:- 

1. Access Your APEX Workspace:

• Go to the specific page where your process is configured.

2. Insert the JavaScript Function:

• Add the following JavaScript function to the Function and Global Variable Declaration section in your Oracle APEX page.

function _removeParam(key, sourceURL) {

   var url = new URL(sourceURL);

   url.searchParams.delete(key);

   return url.toString();

}

• This function accepts two parameters:

1. key: The URL parameter to remove (in this case, “success_msg”).
2. sourceURL: The current page URL.

• It uses the URL object to parse the current URL and removes the specified parameter using searchParams.delete(key).
• The updated URL is then returned without the success_msg parameter.

 

3. Execute the Function on Page Load:

• Next, set up a Dynamic Action to execute the function when the page loads:

1. In Page Designer, under the page you’re working on, click Dynamic Actions.
2. Click Create and choose Dynamic Action.
3. Name it “Remove Success Message Parameter”.

4.For Event, select Page Load.

 

5.Under True Actions, add a new action and select Execute JavaScript Code.

6.Paste the following code:

window.history.pushState(null, null, _removeParam(“success_msg”, window.location.href));

• This code calls the _removeParam function to remove the success_msg parameter from the URL.
• history.pushState updates the URL in the browser without reloading the page.
• As a result, the success message will not trigger again when the page is refreshed.

 

Conclusion :-

Preventing duplicate success messages after a page reload in Oracle APEX can be effectively achieved by using a JavaScript function to remove the `success_msg` parameter from the URL. This guide explains how to implement a global JavaScript function and a dynamic action that executes on page load to ensure the success message appears only once. By removing the URL parameter responsible for triggering repeated messages, you can provide a cleaner, more intuitive user experience. This approach not only eliminates user confusion but also enhances the overall professionalism and functionality of your Oracle APEX application.