Oracle APEX Tips & Techniques

Few years back, I have learned about Web Components. However, I did not get a chance to work on Web Components yet. It's been on my do to list to experiment Web Components, especially with in APEX. My current staycation gave me an opportunity to do this experiment. Web Components Web Components is a suite of different technologies allowing you to create reusable custom elements — with their functionality encapsulated away from the rest of your code — and utilize them in your web apps. In other words, using Web Components, we can create custom elements which are completely self contained with all HTML, CSS and JavaScript (JS) encapsulated in one place. And then we can use these new custom element in our web applications with out the risk of code conflicts. Functionality wise, they are similar to jQuery widgets, however to implement Web Components we don't need any additional libraries, all modern browsers natively support underlying technologies. If you are new to Web Components

When we define "Help Text" for page items, then APEX displays a little "?" icon next to the page item. For Interactive Grids (IG), help icon is displayed when users click on the column header. When we click help icon, then we can see the help text defined for the item. In some cases, this may not be very handy for users. Let's consider a user registration form in your website. Users might be coming for the first time to your website and users may not be aware that they must click on the little icon to see the help text. In such cases, displaying help information proactively will be helpful for users. In this blogpost, I am going to explain a simple approach to proactively display item's help text to users. Summary of this implementation: Create "Help" region which displays help text based on page Item Name or IG column Static ID. When user focuses on any field, then get the Item Name or IG column Static ID. Set these values into hidden page items a

Recently one of the users has asked a question "Would it be possible to display selected master row data in detail interactive grid region header?". Yes, why not, it's indeed a reasonable request. However, during implementation, I have found it is little tricky to implement a solution which works in all cases and finally I have managed to get it done. I am sharing this here as it may help other APEX developers. When user selects any row using the row selector check box or when user just clicks on any row, then selectionchange event is fired. This event is fired, irrespective of whether IG is in edit mode or not. So, we can use this event to get data from selected master record. For demo purpose, consider Interactive Grid (IG) on Department table as master and IG on Employees table as detail. And assume requirement is to display selected/current department name in Employees IG region title.  To implement this, let's create Dynamic Action (D.A.) as below Create D.A. an

APEX_ZIP API was introduced in APEX version 5.0. It has made generating zip files from the database easy. Nothing has changed with this API since then. Here is the sample code to generate a zip file using these APIs. DECLARE l_zip_file BLOB ; BEGIN -- zip all the files uploaded to current application "Static Application Files" FOR l_file IN ( SELECT filename file_name ,blob_content file_content FROM apex_application_files WHERE flow_id = :APP_ID )LOOP apex_zip.add_file( p_zipped_blob => l_zip_file ,p_file_name => l_file.file_name ,p_content => l_file.file_content ); END LOOP; BEGIN apex_zip.finish(p_zipped_blob => l_zip_file); EXCEPTION WHEN value_error THEN -- if there is no file added so far, then apex_zip.finish raises VALUE_ERROR -- do nothing

 In this blogpost, I am going to explain different ways using which we can include images as part of the email content. CID Attachments In this approach images are sent as attachment to the email and then images are referred in email content using attached filename. For e.g. if you want to include image "ironman.jpg", then you need to attach this image file to the email. Then you can refer the attached image using below syntax in "img" tag "src" attribute. <img src= "cid:ironman.jpg" alt= "ironman" /> Sample PL/SQL code to use this approach DECLARE l_body CLOB ; l_body_html CLOB ; l_img_html CLOB ; l_id NUMBER ; BEGIN -- build html email body l_body_html := '<!DOCTYPE HTML>' || '<html>' || '<head>' || '<meta http-equiv="Content-Type" content="text/html; charset=

If you have worked with Gantt Chart, you may have noticed that it does not support "Link" feature where as other chart types support it. This is because Gantt chart is based on ojGantt API which does not support link feature, where as other chart types uses ojChart API and ojChart does support "Link" feature. Luckily, Gantt charts supports " selection " feature and we can use this feature to implement (mimic) link feature. To demonstrate this, let's considered a simple use case "Whenever user clicks on task bar, then we need to take user to 'Edit Task' page". To implement this, first, we need to enable "selection" feature on Gantt chart. By default, this option is disabled. For this, we need to write below JavaScript code in "Gantt Chart > Attributes > Advanced > JavaScript Initialization Code" section. Gantt Chart JavaScript Initialization Code function (options) { options.selectionMode = "single&

When we click on IG column header and if filtering is enabled for that column, then depending on column type, quick filtering "options" (distinct values or date filters) will be displayed. In a recent demo, one of the users has asked, is it possible to show any control to quickly filter for rows having no value for the selected column, like "(Blanks)" filter in Excel. First thing that came to my mind was to use COALESCE for nullable columns and display "(Blanks)" text instead of NULL. This works well for string columns, but not for columns with DATE or NUMBER types. Also, if we use this approach, we need to ensure "(Blanks)" text won't be displayed in downloaded files. We can solve our problem if we Somehow add new "control" in column header menu Apply "Is Empty" filter, preferably using JavaScript, when user selects/clicks new "control" When we click on column header, then APEX appends dynamic DIV element with I