APEX 5.1.1 - Interactive Grid Problems
Hi,
I've been testing the Interactive Grid in APEX 5.1.1 on apex.oracle.com in the past few days and found some problems and "interesting" behavior. Hope you can reproduce and fix them.
All tests happened on Google Chrome 56 on Mac in a 1280x800 screen size.
1) Pagination Bar and Collapsible Region Problem
Easy to reproduce: open die Sample Interactive Grid demo -> Editing -> Basic editing. Now collapse the region "Overview: Basic Editing" and notice the position of the grid pagination bar.
2) Search box and buttons are grayed out and can't be entered
That may be by design, but is very confusing. IG seems to search only in text columns, not number or date. So when you have a grid based on a query with numbers only (ie DEMO_ORDER_ITEMS), you can't search. This behavior is different to Interactive Report.
3) Freezing one column, freezes all other columns to the left
Let's say you freeze the fifth column and unfreeze it again. Now the first four columns are still frozen.
4) Master-Detail works only for editable grids
Create an editable grid on DEMO_CUSTOMERS, then 2 readonly grids on DEMO_ORDERS and DEMO_ORDER_ITEMS and create Master Detail between CUSTOMERS and ORDERS. Then create Master Detail between ORDERS and ORDER_ITEMS. Run the page. MD between Customers and Orders works perfectly fine. But nothing happens between Orders and Items.
To fix that either set a PK on ORDERS or switch ORDERS to editable. Problem here is a missing exception, I guess. Even better would be an error message in page designer when defining a master-detail relation and the pk-column on master isn't set.
5) Too many debug messages
Switching on debug floods the javascript console with internal grid messages.
6) Number column with format mask shows validation error
Editable Grid on DEMO_ORDER_ITEMS. Set Format Mask of Column PRODUCT_ID to 0000000000. Now run the grid, activate edit mode in the PRODUCT_ID column, leave the column without any changes and see the validation error popping up.
7) Fix Heading to Region and set Maximum Report Height
This is misleading. Setting a maximum Report Height results in a fixed report height. It doesn't grow until it reaches this height, it is always that tall. ie: try 4000px, you'll find your grid pagination/footer way down, even when there are only 5 records displayed.
8) DA on column listening for "click"
I defined a dummy Dynamic Action listening for "click" on a column in a grid and showing an alert. If that column is editable, the alert is shown only on the second click. The first one seems to trigger the edit-mode.
For a readonly column, the DA doesn't fire at all.
9) Two grids next to each other
2 editable grids (DEMO_CUSTOMERS, DEMO_ORDERS) are shown next to each other. Also defined master-detail.
On a 1280x800 screen size the columns in the first get narrowed a lot, only 2-3 chars per column can be seen. And it still doesn't fit everything. Lets have a bigger minimum width, ok?
When walking through the first grid, the second one (master-detail) gets refreshed accordingly (and slow), but makes its toolbar jump up and down. Every second record it stays shifted up a bit, then being displayed normal again.
xx) others
There have been several situations where I acted as a user only and got the grid into a non-responsive state. Simply by dragging columns, searching, pagination or scrolling, entering data, and so on.
Only a page refresh would help than. I was not able to reproduce them or have any error info, since at those tests the console was off. Anyway, I'm mentioning that because it just happened too often, guess there are still some bugs to be ironed out.
Documentation
It's really nice to have such a powerful component and a sample application. But there are huge gaps in terms of documentation. Other than some examples there is no documentation around the Javascript Code setting in the advanced section. How do you expect people to understand what they can do in this section?
On the one hand there are less declarative settings in IG than in IR, but then you don't tell how to achieve the same results with the Javascript Code?