Automatically activate the "edit" mode on page load (Interactive Grid #1)
Timo joined Hyand in Ratingen, Germany, as a Senior Consultant in 2019, focusing on Oracle databases and APEX applications. With a background as a Data Warehouse Specialist, he has expertise in Database Administration, performance tuning, and SQL development. Timo is passionate about web development, cloud computing, and the architecture behind it, and became part of the Oracle ACE Community in 2023. He enjoys sharing his knowledge at conferences and through blog posts. When he's not working, you can find him traveling, hanging out with his family, or cooking up something in the kitchen.
Introduction
In this series we want to list tiny useful tricks and tips for the Oracle APEX Interactive Grid one by one. Just a few additional lines of CSS or JavaScript code can quickly provide solutions, so that the grid can be customized in a user-friendly way.
Let's start with the first tip :-)
#1 Automatically activate the "edit" mode on page load
A customer asked us why he always has to switch to "edit" mode in the grid first. It is inconvenient to click first in a cell and then activate the edit mode either by clicking the "edit" button or by clicking again. With one extra line of JavaScript code we can solve the problem ;-)
First, we assign a static-id to the Interactive Grid, so that we can address it via JavaScript without any problems. In our example this is "my_ig".
Then we create a Page Load Dynamic Action with a True condition that executes a JavaScript code. Enter the following line in the code editor:
apex.region("my_ig").call("getActions").set("edit", true);
Since we don't need the "edit" button anymore, we can hide it with another line.
To do this, add the following line in the code editor:
apex.region("my_ig").call("getActions").hide("edit");
And here is the link for the demo app.
We hope the tips and tricks will help you. If you have any questions or suggestions, please leave us a comment ;-)
Read more
https://docs.oracle.com/en/database/oracle/application-express/20.1/aexjs/interactiveGrid.html
