Last week I presented Interactive a Grid Deep Dive for APEX Office Hours where I demonstrated a new version of the IG Cookbook.
The video and slides are now available. The presentation covered important aspects of the Interactive Grid architecture. As promised I’m making the latest IG Cookbook (release 4.0) for APEX 18.2 available for download. As always make sure you install the Sample Interactive Grids app first because it creates some needed tables.
There are many exciting additions and improvements.
New sample pages added:
- Column Help: This page shows how to display the column help in a tooltip on the column header. Example of an async tooltip including caching. Also shows a trick for getting the current focused column.
- Wide Report: This examples shows how to deal with the issue of having to scroll to the bottom of a page to access the horizontal scroll bar.
- Master Detail: This page demonstrates how to put an Interactive Grid into an Inline Dialog region and how to disassociate the detail region from the master so that the detail model instance is only set on demand. It also demonstrates how to deal with the IG master detail limitation where it is not clear which details have been edited and if there is a validation error in any of the detail record edits the user has no idea which one it is. There are two versions of this page one that saves changes when the detail dialog closes and one that saves all detail edits with the master.
- Lazy Tabs: This shows how to make interactive grid not load and render any data until the tab it is in is activated. This helps improve page load time when there are many interactive grids on the page. There are two versions of this page. One scrolls the whole page and the other has a fixed size page and each tab has its own scrollbar.
- Tabbed Record Editing: This page shows how the model can be used independently of the Interactive Grid UI. It allows editing any number of employee records each in their own tab.
Summary of changes:
- Many fixes and improvements were made to the Rich Text and Custom Popup page. The Custom Popup plug-in is updated. It now supports inline popup or inline dialog region templates. It supports multiple inputs and outputs. Search is improved in the popup that contains an Interactive Grid. There is a separate demo page for the Custom Popup plug-in.
- The Tasks page now supports Alt+Up and Alt+Down keyboard shortcuts to reorder selected rows. Previously the grid widget was blocking those keys.
- The Tasks page has a number of fixes and improvements including a checkbox column. This is something people have been asking for since Interactive Grid first came out. The checkbox works in both edit and navigation mode.
- The IG Cards page has improvements to the way search is handled. Each search replaces the previous one rather than add a new filter. The report settings area is only shown if there are other filters.
- A number of pages that update an inline modal dialog or popup have been updated to use the new (not yet documented) apex.theme openRegion and closeRegion methods.
- The Windows List View Style page had some CSS rules updated because the hover checkbox broke due to changes in markup for grid widget pseudo selection checkboxes.
- Copy Down page was changed to use the grid widget methods rather than custom code to go direct to the model.
- The Spinner page needed to have the jQuery UI file path updated for new jQuery UI version.
- The Update Selection page has a minor improvement to Increase Salary inline dialog region. How dialogs are opened and closed is updated.
- The Custom Row Height page needed a CSS fix so that the column items would be vertically centered in the tall cell. Also updated to reflect the new automatic handling of heading height.
- The Variable Height Rows page is updated to change the way the Notes column is truncated. This works now because a hidden column with Value Protected = No can be updated in the model without getting a server error.
- Cell Style Based On Data was updated because the grid widget now responds to highlight metadata changes. The refresh is no longer needed.
- A number of fixes were made to the Double Grid page.
- Made the left side nav wider using Theme Roller.
- Added new updated template for inline popup region.
- Added new region template for jQuery UI Tabs.
- There is an install validation to check that the needed tables exist. Hopefully this will catch people that install this app without installing Sample Interactive Grids first.
You can read about and download the previous IG Cookbook version here.
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.