Skip to Main Content

APEX

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

How to clear out a file inline dropzone control?

TinkerBoyMay 22 2025

Hi. I have a page where a user has to upload some file. I have some javascript code that will check the size and extensions and that works fine. But I am not able to clear out the file from the control when there is an error.

When there is a error the message shows correctly

But the file name is still there even if I set the item to null

If I change the item to a Native File Browser then it will work fine

How can I get the same in the Dropzone control to clear out the file name if there is a error ?

ChatGPT gave me the code in Javascript to clear it out but it is not working.

function validateFileUnder(fileid) {

if (window.File && window.FileReader && window.FileList && window.Blob) {
var fileSize = 0;
var fileInput = $('#' + fileid)[0];

   `if (!fileInput || !fileInput.files || !fileInput.files[0]) {`  
       `return true; // No file selected`  
   `}`

   `fileSize = fileInput.files[0].size / 1048576; // MB`  
   `var fileName = fileInput.files[0].name;`  
   `var fileExtension = fileName.substr((fileName.lastIndexOf('.') + 1)).toUpperCase();`  
   `var validExtList = 'JPG,JPEG,PNG,CSV,PDF,TXT,ZIP,DOC,DOCX,PPT,PPTX,XLS,XLSX';`  
   `var fsizeMB = Math.round(fileSize * 100) / 100;`  
   `var ferror = 0;`

   `if (fileName.length > 50) {`  
       `apex.message.alert('The maximum limit for file name is 50 characters including extension.');`  
       `ferror = 1;`  
   `} else if (validExtList.search(fileExtension) == -1) {`  
       `apex.message.alert('You can only attach files in the following file formats: JPG, JPEG, PNG, CSV, PDF, TXT, ZIP, Word files (DOC and DOCX), PowerPoint files (.PPT and .PPTX) and Excel files (.XLS and .XLSX)');`  
       `ferror = 2;`  
   `} else if (fsizeMB > 20) {`  
       `apex.message.alert("You cannot upload a file greater than 20 MB. Your file size is " + fsizeMB + "MB.");`  
       `ferror = 3;`  
   `}`

   `if (ferror !== 0) {`  
       `$s("P45_UNDER_FILE_ERROR", ferror);`

       `// ¿ Clear the Dropzone UI and file reference`  
       `var dropzoneContainer = $('#' + fileid).closest('.a-FileDropzone');`  
       `if (dropzoneContainer.length) {`  
           `dropzoneContainer.removeClass('a-FileDropzone--hasFile');`  
           `dropzoneContainer.find('.a-FileDropzone-filename').text('');`  
           `dropzoneContainer.find('input[type="file"]').val(null);`  
           `dropzoneContainer.find('.a-FileDropzone-removeFile').remove(); // optional`  
       `}`

       `// Also clear the APEX item value (if applicable)`  
       `if (typeof apex.item === 'function') {`  
           `apex.item(fileid.replace('_FILE', '')).setValue('');`  
       `}`

       `return false;`  
   `}`

   `return true;`  

} else {
// File API not supported, assume valid
return true;
}
}

This post has been answered by Scott Wesley on Jun 17 2025
Jump to Answer
Comments
Post Details
Added on May 22 2025
5 comments
262 views