This Oracle Apex tutorial shows, how to download a CSV file from the interactive report by calling it from another page with parameters. It will directly download the CSV file without opening that page having the interactive report.
To demonstrate this example, I am using the following EMPLOYEES table:
CREATE TABLE "EMPLOYEES" ( "EMPLOYEE_ID" NUMBER(6,0), "FIRST_NAME" VARCHAR2(20), "LAST_NAME" VARCHAR2(25), "EMAIL" VARCHAR2(25), "PHONE_NUMBER" VARCHAR2(20), "HIRE_DATE" DATE, "JOB_ID" VARCHAR2(10), "SALARY" NUMBER(8,2), "COMMISSION_PCT" NUMBER(2,2), "MANAGER_ID" NUMBER(6,0), "DEPARTMENT_ID" NUMBER(4,0) ) /
You can create this table in your schema and insert some data to practice this example.
1. Create a Page in Oracle Apex for the Interactive Report
I have created a page number 10 and created an Interactive Report in it with a Page Item P10_EMPID.
Used the following SQL query and the settings for the interactive report:
select EMPLOYEE_ID,
FIRST_NAME,
LAST_NAME,
EMAIL,
PHONE_NUMBER,
HIRE_DATE,
JOB_ID,
SALARY,
COMMISSION_PCT,
MANAGER_ID,
DEPARTMENT_ID
from EMPLOYEES
where employee_id = :P10_EMPIDPage Items to Submit: P10_EMPID
Below is the screenshot of the above settings:
2. Set the Attributes of the report as shown in the below image
Save the changes for Page 10. Now we will call this report from another page with that page's Employee ID as a parameter to Page 10.
3. Create a Button on Another Page to Download CSV file
I have a Page 3 in my application having the item P3_EMPLOYEE_ID.
I created a button "Download CSV" with target action to "Redirect to URL" and added the following URL in it:
f?p=&APP_ID.:10:&SESSION.:CSV:NO:RP:P10_EMPID:&P3_EMPLOYEE_ID.
You can notice in the above URL, that I am passing the page item P3_EMPLOYEE_ID as a parameter to page 10 item P10_EMPID. Also, you can change the CSV to other formats such as PDF, XLS, RTF, etc.
Below is the screenshot:
Save the changes for the page and run the page to test.
Now when you will click on the Button Download CSV it will directly download the CSV for the employee id stored in page item P3_EMPLOYEE_ID.
Below is the sample of CSV content:
"Employee Id","First Name","Last Name","Email","Hire Date","Job Id","Salary","Commission Pct","Manager Id","Department Id","Phone Number" "103","Alexander","Hunold","AHUNOLD","03-JAN-06","IT_PROG","9000","","102","60","590.423.4567"
HI Vinish,
Can we implement Download functionality for Interactive Grid in the form of a button rather than default Actions -> Download option.
Select your interactive grid report and add the following JavaScript code into Attributes > Advanced > JavaScript initialization code:
function(config) { var $ = apex.jQuery, toolbarData = $.apex.interactiveGrid.copyDefaultToolbar(), toolbarGroup = toolbarData.toolbarFind("actions1"); toolbarGroup.controls.push( { type: "BUTTON", action: "show-download-dialog", iconBeforeLabel: true }); config.toolbarData = toolbarData; return config; }It will create a Download button next to the Actions menu button.
HI , Is it possible to display the DOwnload button in another location ...say Below region ?
Thank you so much for your quick response.
Actually i have a requirement to add Download and Upload functionality for my IG. I used a github plugin Download APEX Report [Plugin] for IG download. FOr some reason this give a Security Violation! error . Same plugin works well for classic report and IR. I am looking for Download and Upload buttons to locate side by side , may be on the region Edit ... Hence the issue.
I tried the javascript you suggested and it does work well...but is there any way i can incorporate Upload Button [which has a Dynamic Action defined] also there.
Thank you
Try the below code, it will create the download and upload buttons but at the same location.
function(config) { var $ = apex.jQuery, toolbarData = $.apex.interactiveGrid.copyDefaultToolbar(), toolbarGroup = toolbarData.toolbarFind("actions1"); toolbarGroup.controls.push( { type: "BUTTON", action: "show-download-dialog", iconBeforeLabel: true }); toolbarGroup.controls.push( { type: "BUTTON", action: "upload" }); config.toolbarData = toolbarData; config.initActions = function( actions ) { actions.add( { name: "upload", label: "Upload", action: function(event, focusElement) { apex.message.alert("Execute JavaScript code to call page, for example: javascript:window.open('yourapexurl', '_self')"); } } ); } return config; }And for upload button, you can execute JavaScript code to open the another page or set the value of an hidden item and then execute the dynamic action as per your need.
Thank you so much for your suggestions, it worked well for me.
Hi Vinish,
Is it posible to do customizing/editing the Action menu item => download for Interactive Report. For example show/hide the download menu option using JS in APEX 5 IR report.
Thanks you.
Rose