The plug-in enables dynamic drawing of regions based on a SQL query. Users can create their own dashboards adapting regions positions and sizes to their needs and save them in various ways.
- Possibility to lock editing positions and sizes by the user
- Default element position and location can be given in:
- SQL query
- JSON
- Saved regions positions and sizes by end-user can be stored in
- APEX Collection
- APEX ITEM
- Browser Local storage (it also support for public users without an application user)
- Not stored (always get from defaults positions)
- APEX dynamic action refresh support
- Region colors adjustment
- APEX-like layout
- This plugin based on gridster.js jQuery Plugin https://dsmorse.github.io/gridster.js/
Demo Application installation:
- Import the demo app from:
apex_sample_application/gridster_sample_application.sql
Online demo now available. Use link below:
APEX_GRIDSTER_PLUGIN (oracle.com)
-
Oracle Database 11.2g or later (not tested on earlier versions).
-
Oracle Application Express 18.2 or later (no extra grants needed).
- Download the latest release
- In your application, go to Shared Components -> Plug-ins and click Import
- Import the plugin file:
apex_plugin/gridster_plugin.sql
-
Parameters are set by (Region attribute) - s. There are:
-
SQL Query (Region source) - Source of regions. Example:
select ROWNUM ID, HEADER, CONTENT, ICON from TABLE;
Sample to try out:
select ROWNUM ID, COLUMN_VALUE HEADER, COLUMN_VALUE || ' <br>'||to_char(CURRENT_TIMESTAMP, 'HH24:MI:SS') CONTENT , CASE WHEN ROWNUM >2 THEN 'fa-sun-o' else NULL END ICON from table (apex_string.split('APEX<br>APEX;ORACLE;APEX PLUGIN;SAMPLE DATA;SAMPLE MORE DATA', ';' ))
-
Region identifier (Region attribute) - Query column with item ID. Connects saved size and position of elements with data from SQL.
-
Region header (Region attribute) - Query column with headers of regions
-
Region content (Region attribute) - Query column with contents of regions (allows the use HTML)
-
Region image (Region attribute) - Query column with APEX icon class.
-
Default position based on (Region attribute) - source of regions defaults positions and sizes. It is:
-
Columns - allows to retrieve the default positions based on the query columns using the following parameters:
- Region Column (X position) (Region attribute)
- Region row (Y position) (Region attribute)
- Region X-size (Region attribute)
- Region Y-size (Region attribute)
-
JSON - allows to retrieve the default positions based on the JSON format and set in parameter:
-
JSON with positions(Region attribute)
JSON structure:
[ { "id": 5, "row": 1, "col": 1, "size_x": 2, "size_y": 1 }, {...} ]
Sample to try out:
[{"id":5,"row":1,"col":1,"size_x":2,"size_y":1},{"id":3,"row":1,"col":3,"size_x":2,"size_y":1},{"id":1,"row":1,"col":5,"size_x":2,"size_y":2},{"id":2,"row":2,"col":1,"size_x":2,"size_y":1},{"id":4,"row":2,"col":3,"size_x":2,"size_y":1}]
-
-
-
Height (Region attribute) - Region height
-
Regions headers color (Region attribute) - Regions header color
-
Font default color (Region attribute) - Header font default color
-
Allow user to change positions (Region attribute) - Disabling and enabling the modification and size of regions by end users. If is enabled there are next items:
- Save layout button text (Region attribute)
- Store user position and size in (Region attribute) - choose where items saved by end users are saved. The possibilities are:
- Don't store - Position always get from region defaults positions, but users can still change its.
- Local storage - Saves positions in the end user browser (it also support for public users without an application user).
- APEX Item - JSON with items will be stored in APEX item:
- Item to store positions (Region attribute)
- APEX Collection - JSON with items will be stored in APEX Collection:
- Collection name (Region attribute) - The name of the APEX collection in which the items will be saved.
The columns assigned:
- n001 => "id"
- n002 => "row"
- n003 => "col"
- n004 => "size_x"
- n005 => "size_y"
- Collection name (Region attribute) - The name of the APEX collection in which the items will be saved.
The columns assigned:
-
-
Plugin support refreshing source by dynamic dynamic action
-
Plugin can trigger APEX Dynamic Action after user click "Save layout" button.
Release number | Release date | New features |
---|---|---|
1.0 | 2020-01-05 | Initial release |
1.1 | 2020-01-19 | +Store position in APEX collection +Fix relocation after refresh +Online demo |
If you have idea to new functionality see Support section.
-
Plugin is publish in MIT license.
-
If you find any bugs or you have idea to extend functionality of plugin feel free to use issues section or send private message.
-
I will be glad to hear about your feedback