Introducing: A Reusable Plug-in for Dynamic Row Refresh in Oracle APEX

You’ve built a beautiful report in Oracle APEX and you’ve added a modal dialog to update the details. But there’s one problem — how do you update specific parts of your page without disrupting the user’s experience? That’s where the Dynamic Row Refresh plug-in comes in. In just a few steps, you can make your report update dynamically the moment the dialog closes, keeping everything in place and avoiding unnecessary page reloads.

Want to dive in directly? Watch the demo.

Building on the Foundation: A Reusable Plug-in

In a previous blog, we explored the concept of dynamically refreshing rows in Oracle APEX using custom templates. We demonstrated how to leverage APEX’s internal mechanisms to evaluate conditions and substitute variables on the fly, ensuring that your application remains both flexible and maintainable.

While the previous blog covered the technical details of dynamically refreshing rows, this plug-in abstracts much of that complexity, allowing you to:

1. Simplify Integration: Add dynamic row refresh capabilities to any (custom) template-based report with minimal setup.
2. Enhance Maintainability: Keep your codebase clean by centralising the logic into a plug-in that can be updated or extended as needed.
3. Increase Reusability: Apply the same powerful functionality across multiple pages or applications without duplicating efforts.

For a deeper understanding of the underlying logic, be sure to revisit our previous blog where we explain how to build this functionality from the ground up.

Bringing It All Together

To use the plug-in, simply download it from our repository, import it into your APEX environment, and use JavaScript or APEX’s Dynamic Actions to trigger the row refresh plug-in based on user interactions.

Here’s how you put this into practice:

1. Set Up Your Report (e.g., Cards Layout):
   • Create your report region (e.g., a cards layout) using a SQL query that retrieves the necessary data, including unique identifiers for each row.
2. Link to a Modal or Trigger a Dynamic Action:
   • Whether it’s a dialog, button click, or another trigger, ensure your action returns the correct triggeringElement.When using apex_page.get_url to create links, use the p_triggering_element parameter, especially for regions used as the triggeringElement.
3. Implement the Plug-In:
   • Dynamic Action: Create a dynamic action (e.g., on dialog close or button click) and use the Dynamic Row Refresh plug-in.
   • Region Static ID: Give your region a Static ID and provide it to the plug-in, this allows the plug-in to find corresponding metadata for the columns in your report, e.g. HTML Expressions.
   • Row Identifier: Set the Row Identifier attribute to match your report’s unique row IDs, ensuring the plug-in knows exactly which row to refresh.
   • SQL Query (Row Query): This attribute will hold the SQL query for fetching the row data. It can be a dynamic SQL query including placeholders for page items, which will then be bound during execution.
   • Items to Submit: Specify any page items that need to be passed to the server, ensuring they’re available in session state for the plug-in to use.
   • Template Name: Define the template used for your region, conditions will be automatically determined. Make sure the items used in the template conditions are part of your Row SQL Query.
   • Show Spinner: Show a spinner on the matched element before replacing the identified row, removes it when it’s replaced.
4. Refresh Only What’s Needed:
   • The plug-in will refresh only the specific row or element that matches the Row Identifier, leaving the rest of your page intact and your users delighted

Key Things to Watch Out For

1. The Magic of the triggeringElement
   • In APEX, the triggeringElement is your best friend, especially when working with dynamic actions. Whether you’re using a button click, a region refresh, or a dialog close, the triggeringElement gives you the HTML element that initiated the action. But there’s a catch — if your trigger is on a region, the entire region’s HTML becomes the triggeringElement.
   • Solution: Our plug-in allows you to refresh specific rows or elements within that region. By specifying a Row Identifier in the plug-in’s attributes, you can dynamically match and refresh only the relevant part of the region, making your page updates laser-focused.
2. The apex_page.get_url Trap
   • When generating links, especially for reports or cards, the apex_page.get_url function is essential. But to ensure smooth refreshes after any interaction, always include the p_triggering_element parameter. This tells APEX exactly which element triggered the event, ensuring that subsequent actions target the correct part of the page.
   • Tip: Without the p_triggering_element, APEX may lose track after the first interaction, leading to unexpected behavior. This is especially crucial when the content is dynamic, like a card that changes after a dialog closes or a button is clicked.
3. Binding Variables: A Must-Do
   • In APEX, when you’re using plug-ins, the server-side processing won’t automatically have access to page items unless you explicitly bind them. This is where Items to Submit come in. You must specify which page items that should be passed to the server during the dynamic action.
   • Why It Matters: By submitting these items, you ensure they’re available in the session, making them reliable for any server-side process. This is particularly important if your plug-in logic relies on session state, such as filtering a query based on user input.
4. Template Conditions and Queries
   • When using conditions in your template (like determining which card to update), make sure those conditions are part of your query. For instance, if a card’s visibility depends on a specific condition, ensure that condition is represented in your SQL query to avoid mismatches or errors.
5. Column Formatting
   • Everything that you can set-up on top of the Custom Template is part of the APEX template engine. Think of an approach to put your conditions in the Row Query / Pipelined function and base structure of the HTML in the Custom Template(s) based on conditions, for example:
     • Create different templates depending on your needs, one including a link with a condition :EVENT_LINK is not null and another without link: :EVENT_LINK is null
     • Formatting Masks can be placed in the Row SQL Query like : to_char(current_date, '&APP_DATE_TIME_FORMAT.')
     • Add additional HTML for dynamic parts based on column values in HTML Expressions. Template Directives inside your expression will not be resolved.

Conclusion

This setup isn’t just a clever workaround—it’s a game-changer. By plugging into how APEX handles dialog close events, you’re making your application smarter, faster, and more user-friendly. No more clunky full-page refreshes, just seamless, dynamic updates that keep your users engaged.

🚀 Now, It’s Your Turn!

Bring your APEX pages to life by implementing the Dynamic Row Refresh plug-in. Whether it’s a card, a table row, or any other dynamic content, you’ve now got the tools to keep everything fresh without a full page reload. Go ahead, and make your app smarter, faster, and more dynamic than ever before.