Sonntag, 17. Dezember 2017

APEX Magic Dynamic Links on Buttons

Hello, everyone,
today I want to show you how to create dynamic links for buttons.

Benefits?
In a project I needed a dynamic link on a button. I wanted to transport a selected value from a Selected List to a Modal Page.
Once you understand the rendering of Oracle APEX, the solution is simple.
A button and link is rendered when loading a page. In my case the link had to be adjusted with the new value from the selected list.
If you don't do this, the value that the item had at the last submit is always transmitted.
I had to avoid this and came up with this simple solution.


What is needed?
some JQuery
Additional Item (This holds the new link)

I'll show you two different methods.
One is for Modal Dialog Pages and the other for Normal.
Steps 1 to 4 are the same for both methods

I assume here that you have created a page which is a modal dialog to referend and a button that is define by dynamic action.


1. Creates a hidden item (e. g. PX_LINK) on page were you want to use the dynamic link.




2. Set Static ID on button (e.q. modal_btn)

3. Create a DA on the item to trigger the creation of the dynamic link.

in my case it was a Selected List item.



4. Create in true a Set Value action.


Code:


return APEX_PAGE.GET_URL (
            p_page   => 2,
            p_clear_cache => '2',
            p_items  => 'P2_DEPTNO',
            p_values => :P1_SL_DEPT ); 
Here I use an api call to generate the link.
In my case I have an item on the page which should be set.


Here it is important to set Escape Special Characters to no, otherwise the HMTL codes will be output instead of the characters we need.
Now comes the magic behind Dynmamic link
5. Create a 2nd True action (Execute JavaScript Code) This ist for Modal Dialog

Code:

var link = $('#P1_LINK').val();
$("#modal_btn").attr("onclick", link);

With this piece of code the link of the button is changed.

5. For Normal Page
Code:

$("#link_btn").attr("onclick","apex.navigation.redirect('"+ $('#P1_LINK').val() + "')");

The difference between modal dialog link is,
that apex. navigation. redirect is not generated in the Api call for Normal Pages.

In the demo I have 2 display only items to showing you the generated link.

Thank you for reading