Securely Open an APEX Modal from JavaScript

Jon DixonJon Dixon
3 min read

Introduction

This post explains how to open an Oracle APEX modal page and securely pass unsaved form values as parameters, before they’re committed to session state. This technique is essential when users enter data into fields and trigger a modal window without submitting the page, ensuring values are passed safely and reliably.

Use Cases

  • While entering an address, open a modal to validate the address.

  • When entering a new customer or supplier, open a modal to check for duplicates.

  • Provide additional information about a selection made in a list of values.

Example

In this example, we have created an APEX page that enables users to add Oracle e-Business Suite Suppliers. The user should be able to enter a supplier name and then click a button to use fuzzy search to find potential duplicate suppliers. The user should not have to save the page before performing the duplicate check.

Screenshot showing APEX Page where users can enter a new supplier and check for duplicates

When the user clicks the Duplicate Supplier Check button, the modal below should display potential duplicate suppliers.

We must pass the supplier name when opening the fuzzy match modal page to achieve this.

💡
The Fuzzy search page uses the function UTL_MATCH.JARO_WINKLER_SIMILARITY to identify likely duplicates. Check out this post from Sandra Suarez if you want to learn more about using Fuzzy Search to eliminate duplicates in your ERP.

Button

Let’s start by creating the Duplicate Supplier Check button and adding a dynamic called Check for Duplicate Suppliers:

Check Supplier Name Entered

In the first step of the dynamic action, we are going to run some JavaScript code to make sure the user entered a value in the Supplier field:

APEX Dynamic Action Step 1

apex.message.clearErrors();
if ( apex.item( "P210_SUPPLIER_NAME" ).isEmpty() ) {
  apex.message.showErrors( [
    { type:       "error",
      location:   ["inline"],
      pageItem:   "P210_SUPPLIER_NAME",
      message:    "Please enter an Supplier Name.",
      unsafe:     false
    }
  ]);
  apex.da.cancel();
};

Generate URL for Modal

In the second step, we will run Server-side Code to generate the URL for the modal:

APEX Dynamic Action Step 2

BEGIN
  apex_debug.info ('Supplier [%s]', UPPER(:P210_SUPPLIER_NAME));
  :P210_OPEN_URL := 
    apex_page.get_url
     (p_page        => 225,
      p_items       => 'P225_SEARCH_VENDOR_NAME',
      p_clear_cache => 225,
      p_values      => UPPER(:P210_SUPPLIER_NAME));
END;
💡
In this use case, the modal page we want to open is page 225. This page has Page Access Protection set to Arguments Must Have Checksum. This means we must generate the URL on the server side to ensure the correct checksums are generated for the parameters.
💡
Also, note that we must pass in the supplier's name P210_SUPPLIER_NAME in the Items to Submit field, and return the generated URL to a page item P210_OPEN_URL.
💡
Page item P210_OPEN_URL is a hidden item with Value Protected set to Off. In this instance, setting protection off is safe because anyone manually manipulating this page item in the browser tools couldn’t generate the correct checksums.

This is how P210_OPEN_URL is setup:

APEX Page Item Used to Store the URL

Open Modal

In the final step, we open the modal using the apex.navigation.redirect API:

Conclusion

Securely opening modal pages in Oracle APEX with unsaved user input is a powerful technique for building responsive, user-friendly applications without compromising session security. By combining client-side validation, server-side URL generation, and modal dialog APIs like apex.navigation.redirect, you ensure that parameters are passed with proper checksum validation, even before the page is submitted.

This pattern is especially useful in workflows that rely on mid-form lookups, validations, or auxiliary actions, such as duplicate checks. Once mastered, it becomes an essential part of any APEX developer’s toolkit for building dynamic, modern UIs.

More on Fuzzy Search

  • Check out this post from sssuarez if you want to learn more about Fuzzy Search in the Oracle database.
6
Subscribe to my newsletter

Read articles from Jon Dixon directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Jon Dixon
Jon Dixon

Hi, thanks for stopping by! I am focused on designing and building innovative solutions using the Oracle Database, Oracle APEX, and Oracle REST Data Services (ORDS). I hope you enjoy my blog.