Skip to Main Content

Java Development Tools

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!

Multi-file upload phantom failed row

WP v.2Jan 7 2021 — edited Jan 7 2021

Hi all,
I am implementing a multi-file upload feature, however, every time the multi-file component shows, it has this phantom row that doesn't have a filename or file size but does have the "failed" progress indicator. Clicking the "x" doesn't remove it, calling resetValue() on the RichInputFile doesn't remove it nor does clearing the list of UploadedFile objects that it's bound to.
There is another application that uses multi-file uploads that does not have this problem. As far as I can tell, the code between the two are the same. However, I did notice that this phantom row is part of the DOM in the application that doesn't have the issue but its display is set to none.
image.png
Here is the code for the dialog:

<af:popup autoCancel="enabled" id="irAttPU" contentDelivery="lazyUncached"
		popupFetchListener="#{pageFlowScope.IrBean.resetInputFile('irInFile')}">
     <af:dialog id="d10" closeIconVisible="false" title="Add Attachments"
		dialogListener="#{pageFlowScope.IrBean.multiFileUploadDialogListener}">
          <f:attribute name="inputFileId" value="irInFile"/>
	  <af:panelGroupLayout id="pgl285" layout="vertical">
	       <af:inputFile id="irInFile" simple="true" autoHeightRows="10" maximumFiles="20" autoSubmit="false"
			value="#{pageFlowScope.IrBean.uploadedFiles}"/>
               <af:outputText value="100 MB file size limit, 20 files max per upload" id="ot90"/>
	  </af:panelGroupLayout>
     </af:dialog>
</af:popup>

Here is the CSS:

af|inputFile::multiple-upload-progress-done {
  padding-left: 7px;
  padding-right: 7px;
  border-radius: 3px;
  background-color: var(--light-green);
  color: var(--green);
}

af|inputFile::multiple-upload-progress-failed {
  padding-left: 7px;
  padding-right: 7px;
  border-radius: 3px;
  background-color: var(--light-red);
  color: var(--red);
}

af|inputFile::multiple-content
af|inputFile::multiple-upload-content,
af|inputFile::multiple-upload-content-container 
{
  width: 500px;
}

af|inputFile::multiple-upload-filename {
  width: 250px;
}

af|inputFile::multiple-upload-action {
  padding-left: 20px;
}

af|inputFile::multiple-upload-filesize {
  width: 65px;
}

Here is the managed bean code:

private transient List<UploadedFile> uploadedFiles;

public void setUploadedFiles(List<UploadedFile> uploadedFiles) {
   this.uploadedFiles = uploadedFiles;
}

public List<UploadedFile> getUploadedFiles() {
   return uploadedFiles;
}

public void multiFileUploadDialogListener(DialogEvent evt) {    
     
   String inputFileId = (String) evt.getComponent().getAttributes().get("inputFileId");
     
   if(evt.getOutcome() == DialogEvent.Outcome.ok && uploadedFiles != null && !uploadedFiles.isEmpty()) {
        /* Code that persists the files by passing them to a web service - omitted for brevity */
   }
         
   resetInputFile(inputFileId);
}
   
public void resetInputFile(String inputFileId) {
   RichInputFile inputFile = (RichInputFile) JSFUtils.findComponentInRoot(inputFileId);
   inputFile.resetValue();  
     
   uploadedFiles = null;
}

Any ideas? I'm on JDeveloper 12.2.1.4.

Thanks,
Bill

This post has been answered by Timo Hahn on Jan 8 2021
Jump to Answer

Comments

Timo Hahn

Are both applications developed in 12.2.1.4 or is one migrated?
Timo

WP v.2

Hey @timo-hahn1,
They were both originally written pre-12.2.1.4 (some version of 11g) but the multi-file upload feature was developed after migrating to 12.2.1.4 for both.

Timo Hahn

My advice is to create a small test case built with 12.2.14 and see what you get there. If the phantom line shows up in the test case you can share the case here so that we can look into the problem or you file an SR with support.oracle.com.

Timo

WP v.2

@timo-hahn1,
I created a small test case with 12.2.1.4 and it still shows. Is there a cache that's used by the af:inputFile for keeping track of failed uploads? The very first time I tested the multi-file upload, it didn't have this phantom row (it had the usual drag & drop icon) and after a failed upload attempt I'm seeing the phantom row always, regardless of the app and regardless of the user logged in. I'm wondering if my original failed upload is somehow "stuck" and the framework can't get rid of it.
Attached is the test app.
ThePhantomMultiFileMenace.zip (152.99 KB)

Timo Hahn
Answer

This looks like a skin bug if you set the inputfile to 'simple'.
If you use the normal layout, the phantom file goes away.

Timo

Marked as Answer by WP v.2 · Jan 9 2021
WP v.2

@timo-hahn1,

Wow, yep that did the trick. Thanks a bunch!

1 - 6

Post Details