APEX IG Cookbook Update

Here is an update (revision 2) of the Interactive Grid Cookbook. You can download it here. This revision adds an example of reordering rows. This has been asked for on the APEX discussion forums. The example is a task list editing page.

The example also shows a workaround for the “no data found” error that can happen when saving data if the SQL statement has a where clause. When the IG SQL statement has its own where clause, such as “... where EXAMPLE_COL = :P1_CURRENT“, if the column is editable and the user changes the value so it no longer matches the where expression you get the error. The reason is that as part of saving the data the IG Automatic Row Processing (DML) process tries to get the latest values for edited records and if a record is now out side of the result set because of the where clause you get the error. A number of people have run into this problem.

Feel free to discus the techniques shown in this app or issue with this app on the APEX Discussion Forum. This is not an officially supported sample but I’ll reply if possible and you can all help each other as well.

APEX Interactive Grid Cookbook

[This app has been updated]

At Kscope17 I gave a presentation called “APEX 5.1 Advanced Interactive Grid” that showcased many examples of whats possible with APEX Interactive Grids once you get into advanced customization. I didn’t show how the examples were implemented. I could go deep on one or two examples or show many and I choose to show as many as I could (and still have time to talk about future IG stuff). But I promised to make the IG Cookbook app available so here it is ready to download. I may add to it over time and announce updates on twitter and/or this blog.

There isn’t much to explain about this here because extensive notes are provided on each example page and there are some comments in the code as well. Some of the examples were inspired by questions from the APEX forum.

Feel free to discus the techniques shown in this app or issue with this app on the APEX Discussion Forum. This is not an officially supported sample but I’ll reply if possible and you can all help each other as well.

APEX Client-Side Validation

There is a new little known sorta feature in APEX 5.1 called client-side validation. You may have missed it because it is not listed in the release notes under new features and only mentioned cryptically, almost tangentially, in the release notes section “Compatibility Mode Changes in Mode 5.1”. It says

“… buttons where the Execute Validations attribute is set to Yes also perform some client-side validations (such as item required checks) and will not submit the page until all issues are fixed”

Other hints and evidence for this feature are the new apex.page.validate function, the validate option to apex.page namespace submit and confirm functions, and the new apex.item getValidity and getValidationMessage functions.

Continue reading

Add Checkbox Selection to APEX Tree Region

Hopefully you have already converted to the APEX Tree implementation. This is important because the deprecated jsTree implementation will be removed in the next release of APEX so that we can update jQuery and Oracle JET libraries to the latest versions. Some people are still using the jsTree implementation because they have custom code to do things such as checkbox selection. Questions about how to do this and other things with the APEX Tree have come up many times on the APEX forums.

This article will describe how to add multiple selection with checkboxes to the APEX tree region. You can try it out here. You can also download the app. It is a 5.1.1 app but this technique should work in 5.0 as well.

Continue reading

How to hack APEX Interactive Grid Part 4

In this fourth and final part of the series I’ll cover events and working with the data model. I’ll assume you have read parts 1, 2, and 3 and have at least intermediate level experience with APEX and JavaScript. A very important point is that the information in this article applies to APEX version 5.1.1. Some things may work in 5.1 but I’m not going to bother distinguishing which. Anyone programming Interactive Grid should move to 5.1.1 as soon as possible.

Continue reading

APEX Interactive Grid API Improvements in 5.1.1

Normally there isn’t too much excitement around a patch set release but if you are programming Interactive Grid (IG) then APEX 5.1.1 is a big deal. A number of improvements were made to IG and its component parts that make it easier to configure and control from JavaScript and in some cases make possible things that weren’t possible before. Even if you are using IG without client side custom code you will be interested in 5.1.1 for the 31 bugs that have been fixed. IG will continue to get better and 5.1.1 is a good next step.

Continue reading

How to hack APEX Interactive Grid Part 3

If you haven’t read parts one and two yet you probably should before proceeding with this one. They covered some basics, configuration and toolbar and menu customization. In part 3 I’ll explain how to control and interact with Interactive Grid (IG) using JavaScript. As was already mentioned in parts 1 and 2 this is aimed at people with at least intermediate level experience with APEX and JavaScript Also most of the APIs are not documented or supported.

[Update 5.1.1 28-Mar-2017] This article has been updated to reflect patch release 5.1.1

Continue reading

How to hack APEX Interactive Grid Part 2

Part one of this series covered Interactive Grid advanced configuration. This part is about a specific area of configuration, which is toolbar and menu customization. This blog series assumes at least intermediate level experience with APEX and JavaScript.

[Update 5.1.1 29-Mar-2017] This article has been updated to reflect patch release 5.1.1

Continue reading

How to hack APEX Interactive Grid Part 1

It is nice to see from the questions rolling in on the APEX forums that people are trying to do interesting and advanced things with Interactive Grid (IG). I’m happy to answer questions about how to do things programmatically with IG but in this 3 4 part series I hope to give you some tools, tips and examples to figure things out on your own. This blog series assumes at least intermediate level experience with APEX and JavaScript.

[Update 5.1.1 30-Mar-2017] This article has been updated to reflect patch release 5.1.1

Continue reading

Interactive Grid column widths

Since the first Early Adopter release of APEX 5.1 I have seen a number of questions or complaints about how column widths are handled in Interactive Grid. I think the complaints may be based on misunderstandings of how things work. I hope to explain here everything you need to know about column widths in Interactive Grids. Still, I’m not 100% sure that in implementing Interactive Grid we got it all exactly right. You can let me know in the comments after reading this.

[Update 5.1.1 30-Mar-2017] This article has been updated to reflect patch release 5.1.1

Continue reading

Passing Data in and out of APEX Dialogs

How to pass data into and return data from an APEX dialog is something that comes up from time to time on the APEX forum. I have not seen a comprehensive treatment of this topic so decided to work up an example of the various possibilities.

[Updated 23-May-2017 to reflect 5.1.1 and add detail for when dialogs are opened from navigation menu list]

Continue reading

Remove Component View from APEX Page Designer

In the beginning (or soon after) there was Component View. Then in APEX 5.0 we added Page Designer but left Component View around because it had some die hard fans and “just in case”.

Many speculated on what the ultimate fate of Component View would be. Now in 5.1 a new Component View tab has been added to Page Designer and the original Component View is re-dubbed Legacy Component View. Legacy Component view is disabled by default. To enable it go to Account Menu Preferences and set Enable Legacy Component View to Yes. Once you enable it you can find the link to it on the new Component View tab in Page Designer. Most importantly Legacy Component View is deprecated. The Release notes say:

Component View has been designated as a legacy user interface for editing application pages. Oracle recommends developers use Page Designer instead of Legacy Component View. …

So it will likely be removed completely in a future release. Already in 5.1 there are a number of new components like JET Charts and Interactive Grids that can’t be edited with Legacy Component View. Its just too much work to keep both Page Designer and legacy component edit pages up to date and in sync.

The Component View tab provides the familiar page organization of Legacy Component View with the editing efficiency of Page Designer. For people used to Component View we think it is the best of both worlds.

So Component View is dead, long live Component View!

Some may say “Whats the big deal with the new Component View tab? I’ve already moved on and this new tab just gets in my way”. For those people I have a little secret to share (its totally unsupported and it may not work in the future). You can remove the Component View tab from Page Designer by navigating to Page Designer then opening the browser’s console window and typing in the following code:


$("#componentView,[aria-controls='componentView']").remove();pageDesigner.storeTabsLayout();

This is per user and will persist after you log out. To get it back again from Page Designer open the Settings menu and choose Reset Layout and then refresh the page. Refreshing the page is important because just resetting the layout alone won’t bring it back.

Don’t try this with other tabs.

I hope you enjoy this little trick and enjoy APEX 5.1