Home > ApEx > ApEx Colour Picker Component

ApEx Colour Picker Component

Colour PaletteThis is a colour picker component for Apex that I’ve put together. When a user clicks a colour from the colour-picker, the popup window is closed and the hex value of the colour chosen is returned into the Apex item of the developer’s choosing.

(Update: Apex 3.0 now comes with a colour picker component “out-0f-the-box” so it renders this one useful only if you’re still on a pre- 3.0 release or if you want an alternative.)

See it in action here: http://apex.oracle.com/pls/otn/f?p=9383:12

To use this component, you need to do the following:

  1. Download the code for the PL/SQL function from here. Copy all the code from this file, paste it into SQL Workshop and click “Run”.
  2. From SQL Workshop type: “GRANT EXECUTE ON colour_picker TO PUBLIC” and click “run”.
  3. Save the Colour Picker icon below (right click, save image) as cpicker.jpg. Go to shared components, images within Apex and upload the image as a workspace image (no associated application).
  4. Within Apex go to Shared Components > User Interface > Shortcuts.
    Create a shortcut of type HTML TEXT and give it a name of CPICKER.
    Set its source to be:

    <a href="javascript:popUp2('&OWNER..colour_picker?p_recv_item=#CURRENT_ITEM_NAME#', 190, 435)">
    <img src="#WORKSPACE_IMAGES#cpicker.jpg" alt="Colour Picker" title="Colour Picker" hspace="2"/>
    </a>
  5. Then, for each page item that you want a colour picker put the following in its Post Element Text:”CPICKER”(Exactly as above, including quotes and in uppercase.)
Advertisements
Categories: ApEx
  1. May 18, 2007 at 7:39 pm

    Actually, your color picker looks nicer! Maybe a little bit to big, but I think the colors are much better arranged.

    BTW, maybe you should add a “Archive” section to this blog, because this blog entry isn’t visible anymore on the main page. You have to press the Previous Entries to get here.

    Patrick

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: