grlicaa / iconpicker

Oracle APEX page item & interactive grid item

IconPicker (IP)

Demo

A demo application is available on apex.oracle.com
https://apex.oracle.com/pls/apex/f?p=94650

Preview

Change log

V 2.0. - 06.06.2026 - For versions APEX 22.1 on

• Added more icons to the library
• CSS fixed for newer versions of APEX (22.1 on)
• Added "Translatable" on all label-based attributes
• Reduced plug-in size
• Fixed "Label is corrupted when the template type is Floating" (#3)

V 1.5. - 19.11.2020

• Fixed APEX 20.2 "height: var" problem in css file

V 1.4. - 22.09.2020

• Created #MIN# files
• CSS/JS fix, render without input field lines like in preview image
• Release 1.4 (last version 1.3 was skipped)

V 1.3. - 11.05.2019

• Field validation on IG fixed (#1)
• Fixed error : Uncaught TypeError: $(...).iconList (#2)

V 1.2. - 01.02.2019

• Added support of "Widget: iconList" default: Yes
• required item validation

V 1.1. - 31.01.2019

• Fixed IE issues
• Support for APEX 18.1

ToDo list

Put Icon Categories inside tabs

Support different icon libraries

Install

New install

1. Import plug-in "item_type_plugin_si_abakus_iconpicker.sql" into your application.
2. Add Item on page or Interactive Grid
3. Choose IconPicker[Plug-in] for Item type on Page item or Interactive Grid column
4. Save changes. IconPicker is now ready to use.
5. Please leave some feedback. Thanks!

Tested On (so far):

Browsers

• FireFox 65.0
• Chrome 71.0.3578.98
• Microsoft Edge 42.17134.1.0
• IE 11.523

Oracle APEX Versions

• Application Express 18.x
• Application Express 19.x
• Application Express 20.x
• Application Express 21.x
• Application Express 22.x
• Application Express 23.1

About me

Andrej Grlica
Company The Right Thing Solutions
I have been an Oracle APEX Developer since 2008
When I'm not focusing on a code problem, you can find me on:
Work Email : [email protected]
Private Email : [email protected]
LinkedIn: Link

iconpicker's Issues

javascript error: "Uncaught TypeError: $(...).iconList is not a function

Changed a text field to use the IconPicker plugin. On clicking the list icon the javascript console shows the following error:

IPdoc.js:45 Uncaught TypeError: $(...).iconList is not a function
    at HTMLUListElement.<anonymous> (IPdoc.js:45)
    at Function.each (desktop_all.min.js?v=19.1.0.00.15:2)
    at w.fn.init.each (desktop_all.min.js?v=19.1.0.00.15:2)
    at addItemList (IPdoc.js:44)
    at IPdoc.js:441

The list does then show and the icons can be viewed and selected.

Oracle Application Express 19.1.0.00.15

Label is corrupted when the template type is Floating

Hello Andrej

Very nice Plugin and a function i really missed for a long time! Thank you. Now my users can select custom icons everywhere.

When the template type for the item is set to floating the label doesn't move over the selected icon name. As u can see on the picture below.

I had the same issue a few days ago with a Popup LOV wich was set by javascript. My solution also works for this issue. After setting the value the container element need the class js-show-label.

Best regards Mark

Interactive Grid: field validations stop icon picker popup

For example, if there are other required fields in the grid, they will be highlighted red and the icon picker popup won't appear.

Not a big issue (user just needs to enter the other required fields first) but if this can be fixed it would improve usability.

APEX 18.2.0.00.12