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.
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 );
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.
