Home > APEX, Oracle, Plug-In > My First APEX Plug-In – Color Picker.

My First APEX Plug-In – Color Picker.

For anyone who does not know by now, APEX 4.0 has been released.  And if you have not yet downloaded and upgraded, I say, “What are you waiting for?!?!?!”.  Click here NOW and download it.  I’ll wait.  *insert jeopardy music here*.  Ok, done?  Great!

There are a ton of new features in this release.  One of the most significant ones are Plug-Ins.  In a nut shell, Plug-Ins give you, the APEX developer, to ability to extend the APEX development framework with custom item types, region types, and process and dynamic actions.

I finally got around to playing with them and lets just say I am impressed.  At first, the idea of writing Plug-Ins seems daunting, but after playing with them for an hour or so, it did not seem so hard.  It’s easy to take the example supplied with the sample application and and use it as a outline to make your own.  In fact, that is exactly what I did to make my first item Plug-In.  I encourage you to do the same.  You can also grab my Plug-In and see what I did as well.

In prior APEX releases, if you wanted to include a jQuery plugin on your page, you would have had to embed all the code into the page itself.   And there are many different places to include that code.  Each developer does it a bit differently.  I know myself, I was not very consistent going from page to page within the same application.  This made for maintenance nightmares.  Plug-Ins fix all of that.

The Plug-In I built was a color picker.  I know APEX already has one, but let’s face it, it’s so Web 1.0.  I felt it needed a face lift.   But I  kinda cheated.   I did not write one from scratch.  Well to be completely honest, I did not write any of the JavaScript code for this color picker.  I downloaded a jQuery color picker called Farbtastic written by Steven Wittens and built an APEX Plug-In with the apex_plugin, apex_javascript, and apex_css APIs.  And that is what is so powerful about this Plug-In framework.  Among other things, it allows you to leverage code and jQuery plugins in APEX natively.  So, now I can use my Plug-In on any page of my application as easily as I could use any other item type in APEX.  It’s listed right there in the item type select list with textbox, date picker, shuttle, … and the rest of the default item types.

You can check out my color picker Plug-In and download and install it yourself.

About these ads
Categories: APEX, Oracle, Plug-In
  1. S2s
    July 4, 2010 at 1:37 pm | #1

    Christopher,

    Thanks for saying it’s probably easier to write one of these than at first blush. I’ve played with V4, but haven’t delved into these yet. Nice little tool you’ve written! The interface looks very cool. I’ve used a jquery control in an app I did last year, and it’s wasn’t a walk in the park and I probably did it differently than you would have. Seeing that you’ve done that integration here has me thinking that building plug-ins to call some of the popular jquery controls would greatly benefit the Apex community.

    BTW, I found a small typo in this sentence “So, not I can use my Plug-In on any page of my application as easily as I could use any other item type in APEX.” I would have written privately, but couldn’t find your email address here.

    • Christopher Beck
      July 4, 2010 at 2:51 pm | #2

      Exactly. I see many of the popular jQuery plugins turned into APEX Plug-Ins.

      Wow, only one typo. I’m ahead of the game in this post :D Thanks for pointing it out.

  2. July 5, 2010 at 5:16 pm | #3

    Nice work!
    You should make a popup using jQuery Impromptu to display the color picker. ;)

  3. July 13, 2010 at 8:22 am | #4

    Christopher,

    Nice Plugin, you can add it to http://www.apex-plugin.com, an internet repository for APEX Plugins maintained by the “APEX community”

    • Christopher Beck
      July 13, 2010 at 1:10 pm | #5

      Thanks for reminding me. I meant to add it there as well when I first blogged about it, but forgot. It’s up there now.

  4. Dan
    July 14, 2010 at 4:17 pm | #6

    Nice work!

    • Christopher Beck
      July 14, 2010 at 5:19 pm | #7

      Thank you sir.

  5. July 7, 2011 at 5:51 pm | #8

    Nice plugin.

  6. Abdul Fattah
    February 24, 2012 at 9:57 pm | #9

    Very interesting tool, Excellent work and Nice looking. Many thanks, really great effort.

  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

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: