Recent Posts

APEX CONNECT and POUG High Five

Von Tobias Arnhold → 5.03.2017
Next week the APEX CONNECT 2017 will start. Besides the latest News about Oracle APEX you will have the chance to talk to some of the best developers worldwide.
As I mentioned at the beginning of the year "A new year promises new possibilities!" I'm focusing on students and will hold a presentation about "Next Generation - Erreiche die Mitarbeiter von Morgen".
Besides that I'm always willing to help others so if you have questions don't hesitate to talk to me. I will take the time to listen to your APEX related problem and may be able to help you or guide you a way to success. You know the best thing on conferences is to meet new people.

The other real highlights for me are:
1. Meet the Oracle APEX developers in person.
You need some good APEX related advice then talk to them they wont bite you. :) I'm especially looking forward to talk to Joel Kallman.

2. The hidden jewels besides the keynotes
- APEX / JavaScript / UX / SQL / PLSQL Q&A Panel (Wednesday)
- 1:1 Gespräche - Ask the Oracle Experts (Thursday)

3. Deutsche Bahn is looking for you.
If you searching for a new challenge as an APEX developer and/or project manager then talk to the "Small Solutions" team from Deutsche Bahn. They are searching for more experts and have their own stand at APEX CONNECT.

And after that...



I prepare myself for the most community driven Oracle conference on the planet.

The best known DBA's and developers from all over Europe come to present at the event. They pay for themselves just to be there. Why? It's the common passion which they can't get anywhere else in this concentrated form. I'm happy to be there as well and I will hold the only APEX related presentation. All presentations are held in English. Everyone is welcome to join this amazing event!

JET pie chart in APEX with absolute numbers as data labels

Von Tobias Arnhold → 5.02.2017
The new APEX pie charts only allows percent values as data labels. Luckily the APEX team added an great example in the "Sample Chart" application which shows how to add custom data labels including absolute values by adding custom JavaScript code.

For German applications I prefer to display 10k (10000) like this: 10.000.
Thanks to APEX and JET it is easy to implement.

function( options ){
    this.donutSliceLabel = function( dataContext ){
        var value_ger;
       
        value_ger = dataContext.value.toLocaleString('de-DE', {
                      minimumFractionDigits: 0
                    });
       
        return value_ger;
    } 
    options.dataLabel = donutSliceLabel;
    return options;
}



Info: Technical updates in the JavaScript area are not supported by APEX updates. For example: A future JET version could have some engine changes which will not accept my JS example anymore.


Interactive Report Download Button only for a certain Authorization Role

Von Tobias Arnhold → 4.27.2017
The Interactive Report has this great download feature where you can export everything you can see.
Anyway there are circumstances where the customer doesn't want that feature open for everyone.

In APEX you can only choose if you want the download button or not.
Even so APEX can't do it out of the box. There is a way to make your application able to do it.

Since APEX 5 you can't download when the "Download" is disabled. If you try an almost empty page occurs. Ok that means the "Download" functionality must be activated an I have to disable it manually.

You need to focus on three steps:
 1. Add an authorization scheme.
 2. Hide the download button in the front end. (Visualization)
 3. Disable the download functionality in the back end. (Security)

1. Add an authorization scheme
The authorization scheme will handle the rights that only the correct person is allowed to download from the Interactive Report.
I my case I call it "ROLE_DOWNLOAD" and it works like that:
Type: PL/SQL Function Returning Boolean 
Function Body: return security_pkg.has_role(:APP_USER,'ROLE_DOWNLOAD');
Validate: Once per session

2. Hide the download button
Add a static report id


Add a new "Dynamic Action" on "Click".
jQuery Selector: #STATIC_REPORT_ID_actions_button
Event Scope: Dynamic
Security > Authorization: {Not ROLE_DOWNLOAD}



Add some Javascript to remove the button:
$('#STATIC_REPORT_ID_actions_menu .icon-irr-download').parent().parent().parent().remove();

3. Disable the download functionality
When APEX is exporting something from an "Interactive Report" itjust does a simple redirect on the same page and adds a REQUEST for the specific download type. In my case it is the request "CSV" I want to block.

Add a "Branch" executed "Before Header":


And to disable the download I just redirect on the same page without any request. The trick is to add the right PL/SQL Condition. In this example check for the request and the authorization scheme.

Code:
:REQUEST = 'CSV' and APEX_UTIL.PUBLIC_CHECK_AUTHORIZATION('ROLE_DOWNLOAD') = false

 
In my mind this is simple and secure and shows how flexible APEX really is.

An introduction into the APEX 5.1 Layout View

Von Tobias Arnhold → 4.04.2017
Many of you are still using the old "Component View" but the "Page Designer" introduced in APEX 5 made the developer life much easier.

The top 5 most time saving abilities for me are:
 1. Easy access on all page elements (without any page refresh)
 2. Copy&Paste of items, regions, dynamic actions, ... 
 3. Drag&Drop moving of items and regions
 4. Multi edit of items
 5. Since APEX 5.1: The ability to customize your own personal Page Designer View

The functionality "Layout" introduced in APEX 5 was not in my focus and as I remember I had some issues with it. So I just ignored it.

In APEX 5.1 I started a rerun on it using the "Universal Theme" and I must say it is a real help when you create a complex form page with a lot of page items. It feels different in APEX 5.1 and works almost flawless.

To get in touch with it I prepared a little example for you to help understanding the feature and may get inspired to use it, too.
We start with a page including 16 page items which should be visualized on 3 rows. Some of them are conditional and they are from different types (Text Field, Radio Group, Select List, Textarea).

All items are now displayed one below the other.


What do I aim for in the first step?
1. All items should have the label set to be "above". (Do not use the region template option for that)
2. I want to edit 8 page items split on two rows
3. Items 1-3 per row should be displayed over 2 columns
4. Item size must be adjusted



In between I made a Dynamic Action to make the "detail group" item conditional based on "Organization" if it is null or not.

I did the same for the category selector but I needed some Javascript code to make it right.


Code:
apex.item( "P9_CAT1_NAME_A" ).hide();
apex.item( "P9_CAT1_NAME_B" ).hide();
apex.item( "P9_CAT2_NAME" ).hide();
apex.item( "P9_CAT3_NAME" ).hide();
apex.item( "P9_CAT4_NAME_V1" ).hide(); 
apex.item( "P9_CAT4_NAME_V2" ).hide(); 
apex.item( "P9_CAT4_NAME_V3" ).hide();    

if ( $v("P9_CATEGORY_SELECTOR") == '1' ) {
    apex.item( "P9_CAT1_NAME_A" ).show();
    apex.item( "P9_CAT1_NAME_B" ).show();     
}
if ( $v("P9_CATEGORY_SELECTOR") == '2' ) {
    apex.item( "P9_CAT2_NAME" ).show();  
}

if ( $v("P9_CATEGORY_SELECTOR") == '3' ) {
    apex.item( "P9_CAT3_NAME" ).show();  
}
if ( $v("P9_CATEGORY_SELECTOR") == '4' ) {
    apex.item( "P9_CAT4_NAME_V1" ).show();
    apex.item( "P9_CAT4_NAME_V2" ).show();   
    apex.item( "P9_CAT4_NAME_V3" ).show();       
}

In my final move I finished the page by adjusting the other items.


The page looked like that:


But as always it could be a little bit better and luckily I used APEX. I just had to make a little change on it:

That's it. Hope you will give the "Layout"-View a chance to proof itself. :)


Info:
In case your Page Designer mentions problems in applying some multi update settings. Just refresh the page and try again.

Customize your Interactive Report with CSS

Von Tobias Arnhold → 3.28.2017
A lot of you are using jQuery to customize visual parts of an APEX application. I probably to often do so myself but there is a much more elegant way:   CSS

Nowadays you are able to add different kind of rules into your CSS styles. In this example I will show you how to get into the topic by changing an Interactive Report (IR). In my example I want to change the typical group by visualization.


Before


After


First of all you need to give your IR a unique name or class to identify it properly.
IR > Appearance > CSS Classes: irCustomStyles



Now you need to add the customized CSS code in your page:
Page > CSS > Inline

.irCustomStyles .a-IRR-table td {
    border-top: 0 solid #ffffff !important;
}

.irCustomStyles table.a-IRR-table th:first-child.a-IRR-header:not(.a-IRR-header--group) {
  background-color: white !important;
}

.irCustomStyles table.a-IRR-table tr:has( .a-IRR-header ) {
    border-bottom: medium none white !important;
    border-top: medium none white !important;
}

1. Rule: Takes the border from the TD elements away. Standard CSS probably most of you have done like this before. 
2. Rule: This one changes only the first TH element and when they are not referenced with class ".a-IRR-header--group"
3. Rule: The "has"-clause only applies if the result is true. In this case if a class called "a-IRR-header" exists.

Fore more details check those sources:
:not(s) - By Sara Cope
Selecting Parent Elements with CSS and jQuery - by Thoriq Firdaus

Run dynamic action from report row and pass multiple variables

Von Tobias Arnhold → 2.23.2017
Execute a "Dynamic Action" by clicking on a button/link inside a report row is mostly handled by some triggering HTML class.


It actually works in 95% of all cases. But it is not the best way to do it. It is much more effective to execute the "Dynamic Action" with a custom event.

Reason is simple: You don't need to allocate unnecessary elements via a class by jQuery. You execute the "Dynamic Action" in the moment when it is needed. Like calling explicitly a Javascript function.
This matters if you show maybe 500 rows or more on a single page or you handle several dynamic actions in one report.

Running a dynamic action from inside a report is actually an old hat because there are a few guys which have been written about it. Anyway I'm still searching for it every time I need it and some of the code pieces are not up to date anymore. So I will show you the way I handle it today and probably tomorrow, too. :)

First I must thank Jeff Eberhard for his examples about this topic. He really inspired me using the technique in one of my projects where I had to suffer with many rows inside a report.

Blog posts (www.eberapp.com/ords/f?p=BLOG):
Run Dynamic Action from JavaScript
Execute Dynamic Action From Report Column Link
Pass Multiple Values from Report to Dynamic Action

I prefer this way:

1. Set up a "Dynamic Action":
Custom Event: setIemsFromReport
Selection Type: Javascript Expression
Javascript Expression: document



1.1 Now add some action from type: "Execute Javascript Code"
In my example I set up three APEX items with data from my report row.

Code:
apex.item( "P1_DEVICE" ).setValue( this.data.device_name );
apex.item( "P1_IP" ).setValue( this.data.ip );
apex.item( "P1_KOST" ).setValue( this.data.kost );


Info:
As you see the parameters are forwarded with specific variable names. The example came from Matt Nolan. I prefer it mostly because it is exact and it makes it easier to understand (maintainability).

1.2 To get the values into your APEX database session you add one more action from type: "Execute PL/SQL Code":



2. Report column
Inside my report I define a link column which looks like that:

Type:
Link

Target:
javascript:apex.event.trigger(document, 'setIemsFromReport', [{device_name:'#NAME#', ip:'#IP#', kost:'#KOST#'}]);void(0);

Info
apex.event.trigger executes the "Dynamic Action". 
[{...}] defines the variables to forward.
void(0) prevents the browser to do further actions.

Link Text:
<span class="fa fa-edit"></span> 

Link Attributes (not required):
style="font-size:16px;color:#ICON_COLOR#;display:#ICON_DISPLAY#"

Info:
By using some columns with case when clause I'm able to add some custom attributes like hide/show. Example:
  case
    when SUBSTR(DEVICE,1,1) = 'T'
    then 'inline-block'
    else 'none' 
  end as ICON_DISPLAY


That is all you need to hand over attributes from your report row towards one or more APEX items on your page.

Using APEX_ERROR to manage custom error messages

Von Tobias Arnhold → 1.18.2017
Sometimes you just feel like you would be a newbie in coding business applications. Luckily it doesn't happen so often anymore. But this time it hit me hard. :)

During an application upgrade on Universal Theme I discovered an ugly workaround to create custom error messages I used in that time.

The old code looked like that:
declare 
  retval number;
  p_cust_id number;
  p_status varchar2(30);
  p_upduser varchar2(10);

begin 
  p_cust_id := :p1_cust_id;
  p_status  := 0;
  p_upduser := :app_user;

  retval := cust_apex_pkg.cust_apex_fnc ( p_cust_id, p_status, p_upduser );

  if retval = 1 then
    apex_application.g_print_success_message := '<span style="color: green;">Order was successfully published.</span>';
  elsif retval = 2 then
    apex_application.g_print_success_message := '<span style="color: red;">Error: Custom error 1 occurred.</span>';  
  elsif retval = 3 then
    apex_application.g_print_success_message := '<span style="color: red;">Error: Custom error 2 occurred.</span>';  
  else
    apex_application.g_print_success_message := '<span style="color: red;">Error: Unknown error occurred.</span>';  
  end if;
  commit; 
end;
As you can see I used the apex_application.g_print_success_message to overwrite the text color. Quite ugly but it worked as expected.
Anyway on Universal Theme it looked not so nice anymore because a "success message" has always a green background color. Putting some red text color above is not the user experience I would prefer.


I searched for about 3 minutes and found a really good article from Jorge Rimblas writing about the APEX_ERROR package. The blog post is from 2013 so this procedure must be available for a while now. What made me feeling like a jerk. The good side is that I now can start again to climb up on the iron throne. :)

The updated code looked like that:

declare 
  retval number;
  p_cust_id number;
  p_status varchar2(30);
  p_upduser varchar2(10);

begin 
  p_cust_id := :p1_cust_id;
  p_status  := 0;
  p_upduser := :app_user;

  retval := cust_apex_pkg.cust_apex_fnc ( p_cust_id, p_status, p_upduser );

  if retval = 1 then
    apex_application.g_print_success_message := 'Order was successfully published.';
  elsif retval = 2 then
    apex_error.add_error(
      p_message => 'Error: Custom error 1 occurred.'
    , p_display_location => apex_error.c_inline_in_notification
    );
  elsif retval = 3 then
    apex_error.add_error(
      p_message => 'Error: Custom error 2 occurred.'
    , p_display_location => apex_error.c_inline_in_notification
    );
  else
    apex_error.add_error(
      p_message => 'Error: Unknown error occurred.'
    , p_display_location => apex_error.c_inline_in_notification
    );
  end if;

  commit; 
end;

Thanks Jorges by blogging and sharing your knowledge.