Your SlideShare is downloading. ×
APEX 4.0 Plug-Ins: How to use them ..., How to build them ...
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

APEX 4.0 Plug-Ins: How to use them ..., How to build them ...

4,801
views

Published on

Presentation given by iAdvise @ OBUG APEX SIG (24 May 2011). Read more here: http://iadviseblog.wordpress.com/2011/05/24/obug-apex-sig/

Presentation given by iAdvise @ OBUG APEX SIG (24 May 2011). Read more here: http://iadviseblog.wordpress.com/2011/05/24/obug-apex-sig/

Published in: Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,801
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
93
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. your oracle solutions partnerAPEX 4.0: Plug-Ins How to use them, How to write them …. By Jan Huyzentruyt & Stijn Van Raes
  • 2. iAdvise Started in 2004 (member of Cronos-group) > 55 consultants Since 2006: APEX Core Team O2U (the Nederlands) Oracle Gold Partner © 2011
  • 3. Agenda Introduction How to use them ? How to write them ? © 2011
  • 4. PLUG-INS © 2011
  • 5. Why Plug-Ins ? Make javascript declarative  Structured way of implementing  Encapsulated for developer community Increase reusability  Develop Once, Use Often Increase productivity Make javascript transportable  Exportable as separate/independent component © 2011
  • 6. Plug-In Types There are four types of plug-ins:  Item type plug-ins  Example: Star Rating, Color Picker, …  Region type plug-ins  Example: Google Maps, Google Visualizations, …  Dynamic action plug-ins  Example: Twitter Status update, Yahoo Stock Quote  Process type plug-ins  Example: Get Data © 2011
  • 7. Agenda Introduction How to use them ? How to write them ? © 2011
  • 8. How to use them ? Download a plugin  http://www.oracle.com/technetwork/developer- tools/apex/application-express/apex-plug-ins- 182042.html  http://www.apex-plugin.com/ Import the plugin  Shared Components > Plug-ins > Import Create an item  Select plugins  Select your plugin  [Fill in settings] Run your page © 2011
  • 9. How to use them ? Once loaded, use in similar fashion to native components Not supported at workspace level Included in APEX application export © 2011
  • 10. DEMO © 2011
  • 11. Agenda Introduction How to use them ? How to write them ? © 2011
  • 12. Plug-In EnginePage Rendered by Rendered by plugin apex engine Region Star Pre element Post element Clear Pre element Post element Standard Element Pre element Post element © 2011
  • 13. Plug-In builder What’s in a name  DOMAIN.COMPANY.APEX.PLUGIN_NAME  Ex: BE.IADVISE.APEX.CLEARABLETEXTFIELD Type  Category Subscription Settings  File prefix Source © 2011
  • 14. Plug-In builder Callbacks  Render function (region, item, dyn. action)  Ajax function (region, item, dyn. action)  Validation function (item)  Execute function (process) Standard Attributes Custom Attributes Files Events © 2011
  • 15. How to write them ? Five+ Steps  Step 0: Get the idea  Step 1: Create a render function  Step 2: Add files  Step 3: Add standard attributes  Step 4: Add custom attributes  Step 5: Add events © 2011
  • 16. Step 0: Get the idea Start with an idea  It’s all in your head  Existing jquery plugin: Example © 2011
  • 17. Step 1: Create render function Pl/sql function Get your plugin cheatsheet after the presentation © 2011
  • 18. Step 1: Create render function APEX_PLUGIN API  get_input_name_for_page_item Print input item  HTP.P  Don’t trust the user use: apex_plugin_util.escape © 2011
  • 19. Step 1: Create render function Add debug  apex_plugin_util.debug_page_item Add readonly  apex_plugin_util.print_hidden_if_readonly Add printer friendly  apex_plugin_util.print_display_only © 2011
  • 20. Step 2: Add files Javascript, css, images,... Include them into your plug-in  apex_javascript.add_library  apex_css.add_file Use the plugin file prefix  t_plugin.file_prefix  #IMAGE_PREFIX#, #PLUGIN_PREFIX# © 2011
  • 21. Step 2: Add files APEX_JAVASCRIPT API  Add_library  Add_onload_code  Add_inline_code APEX_CSS API  Add_file  Add © 2011
  • 22. Step 3: Add standard attributes Attributes you can select for your item, region, dynamic action plug-ins Possibility to use the values that are filled in by the apex developer in your plug-in  Apex_plugin.t_page_item  Lov_definition  Element_width  Element_height  ... Use them when you print your plug-in © 2011
  • 23. Step 4: Add custom attributes Define your own plugin ‘parameters’ Use the values that are filled in by the Apex developer in your plugin  Apex_plugin.t_page_item  Attribute_01, Attribute_02,... Attribute_10 Give them a scope  Application, component Make required, conditions Help text! © 2011
  • 24. Step 5: Add events Add your event Use jquery .trigger in the plug-in source  Ex: $("#||p_item.name||").trigger("clear");}) Your plug-in events will appear as dynamic action events © 2011
  • 25. Tips Make plug-in development easier:  Put your files on your server, and use p_plugin.file_prefix to reference them  Put the plugin pl/sql functions in a package on your db scheme  Reference them in the callbacks [package_name.]function_name Firebug is your friend Use jquery Avoid excessive inline js & css code © 2011
  • 26. Tips Test with multiple instances! Read Only and Printer Friendly Mode Secure? XSS & Data Validation Help Text for Plug-In and Attributes! Check the code of plug-ins you use © 2011
  • 27. Q&A © 2011
  • 28. Thank You Email:  stijn.vanraes@iadvise.be  jan.huyzentruyt@iadvise.be Blogs:  http://iadviseblog.wordpress.com/  http://apexcommunity.wordpress.com/ More APEX info on:  http://www.apexcommunity.be © 2011