Upload and View a File (image/pdf/doc) in a List of Oracle Apex Page

Uploading and viewing a file (image/pdf/doc) in the Oracle Apex page is sometimes problematic if we miss steps that we should do. But this is very easy and simple thing as I have experienced. I have kept the process in very easy 8 steps, kindly go through them, they are really easy and will take few minutes only!

1. INSERT 5 FIELDS IN DATA FOR FILE UPLOADING:

When we have decided to uplaod a file, we should have few db columns in our table:

FILE_LOB
FILE_NAME
FILE_MIMETYPE
FILE_UPDATEDATE
FILE_CHARACTERSET

here, the file_name is for holding the full image name (with extension) and file_characterset is used for determining whether it is a 32 bit or 64 bit characterset file.

2. FILE_LOB data type is BLOB OR CLOB?

generally, BLOG is used for binary files (pictures) and CLOB is used for character type (essay or sth like that)

3. what’s next? CREATE A PAGE

Now, do the following to create a page:

Create Page –> Forms — > Forms on a Table with Report –>
–> (write page name) –> (Write the table name) –>
–> (use a tab, write a tab name) –> select all columns (take all in the right box) –>
–> Next (select any edit button) –> Write a Page name –>
–> Manage by Database ROWID –> SELECT ALL (columns) –>
–> (insert,update,delete) Yes –> CREATE –>
–> RUN PAGE

4. EDIT THE PAGE

Now, to edit the page, click the bottom EDIT PAGE # link. now, double click on the REPORT NAME (visible at left side) in the content list of the page.

in the REGION SOURCE, there is a code. copy-paste the following code segments in place of dbms_lob.getlength(“FILE_LOB”) “FILE_LOB”,

dbms_lob.getlength("FILE_LOB") "FILE_LOB",
decode(nvl(dbms_lob.getlength(FILE_LOB),0),0,null,
'<img style="border: 4px solid #CCC; -moz-border-radius: 4px; -webkit-border-radius: 4px;" alt="" width="75" height="75" />')
detail_img,

## NOTE : in place of ‘P16_FILE_LOB’ you have to put page number of the page where the image is being uploaded. like, if your image upload page is Page No 7 then it will be ‘P7_FILE_LOB’

now, save this updates, CONFIRM SAVE.

5. EDIT REPORT ATTRIBUTES

double click on report name again and edit column attributes, select for

Detail Image –> Standard Report Column

now save the updates.

6. SHOW IMAGE IN REPORT COLUMN

in the report page, select, ACTIONS and then SELECT COLUMNS. select DETAIL IMAGE to the right box with “>” and then save it.

7. LAST STEP: SELECT A ROW TO EDIT

click on edit button to edit data of any row.
click on ‘SHOW EDIT LINKS’ at the right bottom corner of the page.
click on the edit button at DOWNLOAD option.
A pop-up will come for EDIT PAGE ITEMS. find the SETTINGS, segment in that page. now in the following options, copy paste the Database fields of respective attributes.

MIME Type Column == FILE_MIMETYPE
Filename Column == FILE_NAME
Character Set Column == FILE_UPDATEDATE
BLOB Last Updated Column == FILE_CHARACTERSET

click on APPLY CHANGES.

8. UPLOAD A FILE AND VIEW IT IN THE GRID:

now upload a file in edit page of a row and then view the uploaded image/pdf/doc from the list in the grid. Hope it worked for you. have a nice day!