Step-1 : If you want Image uplode In Oracle Apex. you must should be create four column.
IMAGE BLOB
MIMETYPE VARCHAR2(255)
FILENAME VARCHAR2(400)
IMAGE_LAST_UPDATE TIMESTAMP(4) WITH LOCAL TIME ZONE
IMAGE_CHARACTER_SET VARCHAR2(100)
Step-2 :
Create your from Design.
Write the PK SAVE Process for save Button (as like)
SELECT NVL(MAX(EMPLOYEE_ID),1000)+1 INTO :P27_EMPLOYEE_ID FROM EMPLOYEES;
*** You shouldn't delete "By-Default" process. It's very importent for Image save.
*** Change Your "Image" Item type and get "file browser".
Select BLOB File then :
Storage Type : BLOB Column Specified
MIME Type Column --> MIMETYPE
Filename Column --> FILENAME
Character Set Column --> IMAGE_CHARACTER_SET
BLOB Last Updated Column --> IMAGE_LAST_UPDATE
Step-3 :
P27_IMAGE ---> Post text (copy following the code and paste)
<canvas id="image-preview" width="100" height="50"></canvas>
Dynamic actions on P27_IMAGE (Select "Execute javascript Code" and copy following the code and paste)
var canvas = $x('image-preview');
var ctx = canvas.getContext('2d');
var img = new Image;
img.src = window.URL.createObjectURL(this.triggeringElement.files[0]);
img.onload = function() {
if (img.width > 200) {
canvas.style.width = "50px";
}
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
$("#container-img-preview").show();
}
Step-4 :
--> You create the new region (Name as like "Image show")
--> Create new item (Name as like "P27_PHOTO_SHOW") and select "Display Image".
--> Server-side-condition -- type -- "Item is not null"-- (EMPLOYEE_ID)
"P27_PHOTO_SHOW" -- Source
--> from Region -- Employee Entry
--> Column -- IMAGE
--> Data type -- BLOB
Step-5 :
You will need to adjust the image size. so you Write "Inline" (copy following the code and paste)
img {
height : 250px;
width : 250px;
}
-------------------------------------------------
If you want Image show in the "Interactive Report". so should be following the 2nd Steps.
Step-1 :
--> Create new page and select the new region type "Interactive Report" on employees.
--> Change Your "Image" Item type and get "Display Image".
Step-2 :
You will need to adjust the image size. so you Write "Inline" (copy following the code and paste)
img {
height : 250px;
width : 250px;
}