How can i execute a dynamic action when i click in the button of a report to change to another page of vale ?
First, change the report template so that it assigns an ID to the next and previous buttons. For example:
Next Page Template:
-------------------
<a href="#LINK#" class="t20pagination" id="#REGION_STATIC_ID#next">
#PAGINATION_NEXT# ></a>
Previous Page Template:
-----------------------
<a href="#LINK#" class="t20pagination" id="#REGION_STATIC_ID#previous">
<#PAGINATION_PREVIOUS#</a>
Then give your report region a Static ID e.g. 'MYREP'. The next and previous links will then have IDs 'MYREPnext' and 'MYREPprevious'.
You can now create dynamic actions referencing those IDs as DOM objects or jQuery selectors.
Be sure to set the dynamic action's Event Scope to "live" so that the actions still work after the report has been refreshed due to pagination.
Related
If user selects one option from select list then that button should link to different URL, if user selects second option from that select list then that same button should land at another URL , Kindly help me in it using ORACLE APEX.
Create a page item P1_URL of type select list
Add a couple of entries - for this example I'm using static values but a query should work too. Make sure the return value of the entry contains the actual url:
Create a button with action "Submit Page"
Create a branch
Execution Options > Point > "Processing"
Type: "Url defined by Item (Redirect)"
Item: P1_URL
Run the page, when you click the button the page should redirect to the selected url.
I am using react-chartjs-2 to render charts and on clicking the active point it gets redirected to some other page.
<Line
id={'chartid'}
data={data}
options={options}
getElementAtEvent={dataset => {
// redirects to some other page
}}
/>
Sample chart
We are doing automation testing and need to check if click is working or not.
Is there any option to add id/class to active elements inside the rendered canvas. Can anyone help?
AFAIK every element has got datasetIndex and index properties related to the drawn dataset.
Emitting the click event on the canvas (a specific point) you could check that dataset index and index are what you are expecting
Below is my interactive grid. It shows data from v$sql_monitor view based on sql_id from list .
What I would like to do is to create double-click dynamic action on a record. This action would open new modal dialog and pass two parameters : 1. sql_id from list above 2.sql_exec_id from clicked record. Would you give me a few hints how to do it ? I guess a piece of Javascript code will be necessary :(
There are multiple options to do this - here is one way, by using javascript custom events. I created a sample with an IG on the EMP/DEPT sample dataset with page 88 as IG and page 90 as modal. The column ENAME is a link to page 90 that sets a column value and a page item in the link.
Page 88 has an IG and 2 page items:
P88_PAGE_ITEM (a value entered on the page like the list in your screenshot)
P88_ENAME (to hold the selected report column value
Page 90 has 2 page items: P90_PAGE_ITEM and P90_REPORT_COLUMN
Create IG on page 90 on table EMP
On column ENAME, add the following under "JavaScript Initialization Code"
function(config) {
config.defaultGridColumnOptions = {
cellTemplate: '<button type="button" class="t-Button t-Button--link my-ename-js" data-ename="&ENAME.">&ENAME.</button>'
};
return config;
}
This is a button of type "display as link", created with the universal theme button builder that has 2 extra attributes: a class my-ename-js and a data attribute "ename" data-ename="&ENAME."
Create a dynamic action to capture the click and set the page item:
Make sure to set the scope to "Dynamic". This is needed because the event listener needs to be added again after a dom change (a search or filter of the IG).
add a true action of type "Set Value" to set the value of P88_ENAME to the value of the selected row
add a second true action to trigger a custom javascript event:
Create a dynamic action of type "Event: Custom" to capture the custom event triggered in the previous DA.
add a true action of type "Submit Page". Note that "Show Processing" needs to be unchecked.
Almost there. One last thing is to create a branch to the modal page:
Create a branch (process point "After Processing") with server-side condition of "Request = Value" with value OPENMODAL and link attributes below:
And this should be the result:
Well, I modified a bit your scenario.
I added new SelectList P88_FILTER
and added dynamic action ON_CHANGE :
with action
I modified source if IG:
These changes allowes me to filter IG . In our case filter returns always only one record like below.
and now my problem begins. In your scenario clicking the link "ename" updates field P88_ENAME and opens modal dialog with proper values. After my modification neither P88_ENAME updates nor modal dialog opens :(
I have a page item which stores URL.
How do i change its type to URL so that the link becomes clickable.
As of now, there is page subtype url, but setting it doesn't make any difference.
Apex 21.1
A text field is an html input element, that will display text only, you probably could write some javascript to open whatever is in the page item in an url but that is confusing functionality. What should happen if the user clicks in the input element ? Should it open the link or should the user be editing the value ?
This is a possibility.
Create a page item on your page, say P1_URL
Add the following in the "Post Text" attribute of the page item (style it to your own preference):
<span class="fa fa-external-link" aria-hidden="true"></span>
Add a dynamic action on change of the element P1_URL with a true action of "Execute Javascript Code" and the following code:
$("#myurl").attr("href", apex.item( "P13_URL" ).getValue())
Check "Fire on Initialization" for the true action.
That is all there is to it, now when you add something in the page item P1_URL and click the link, it will open the that url in a new window.
UPDATE: Technique for read only text field.
For a read only text field, the input element is hidden and an additional span element is rendered with an the page item name as id, suffixed by _DISPLAY. The trick is to grab the content of that span element and add an anchor with attributes. This can be done with an onload dynamic action:
Create a page item on your page, say P1_URL, set it to "Read-Only: Always"
Add a dynamic action on Page Load with a true action of "Execute Javascript Code" and the following code:
let itemVal = $("#P1_URL_DISPLAY").text()
$("#PP1_URL_DISPLAY").html(`<a href='${itemVal}' target='_blank'>${itemVal}</a>`)
Make sure that when you copy this, the quotes are exactly the same: the outer quotes are backticks, those are needed for the ES6 syntax.
Note: check the page documentation for the subtype url - it explains exactly what it does.
I have a Report region that I am refreshing via jQuery. I have the following code with the region footer to set up the refresh process:
<script type="text/javascript">
var refreshId = setInterval(function(){ apex.jQuery('##REGION_ID#').trigger('apexrefresh');
}, 5000);
</script>
This works correctly, and the report data is refreshed every 5 seconds. However, the region also contains an Item, whose source value is determined via a SQL Query. I want this value to refresh every time the report region data refreshes too, but the triggered refresh doesn't do this.
Looking closer, it seems the report region div does not contain the Item HTML, so the part of the DOM that gets swapped out during the refresh does not contain the item. The item appears inside a sibling table node called apex_layout_#REGION_ID#:
<div class="rc-content-main">
<table id="apex_layout_7017903473906209" class="formlayout" border="0" summary="">
<div id="report_7017903473906209_catch">
<script type="text/javascript">
</div>
I've tried doing an additional .trigger() call passing in the Item's ID instead of #REGION_ID# but confusingly this does the exact same refresh of the report data. I've also tried setting up a Dynamic Action to fire on "After Refresh" on the region that will refresh the Item, but this does something strange too - it fires repeated AJAX calls with no delay and doesn't change the item value.
Any help appreciated.
You can't refresh an item using the apexrefresh event. You are on the right track with the dynamic action: you will need to 'manually' retrieve a new value.
Could you elaborate on how you have set up your "after refresh"-triggered dynamic action for your item? Does it have a true action of "set value" with "sql statement"? Did you inspect the ajax calls? Any errors? Do the calls keep repeating? Also, check the session state (access through the "session" button on the developer bar on the bottom) of the items, and see if the value there has changed.