Component: p-fileUpload mode=advanced auto=true not uploading on select

[matteobertozzi]

Describe the bug

When using p-fileUpload in advanced mode with auto=true, the upload is not triggered

<p-fileUpload 
     mode="advanced" [auto]="true" [customUpload]="true"
    (uploadHandler)="onUploadHandler($event)" 

The problem should be this line in fileupload.ts, where there is an explicit check on mode that should be "basic" to trigger the upload()

if (this.hasFiles() && this.auto && !(this.mode === 'advanced') && !this.isFileLimitExceeded()) {

https://github.com/primefaces/primeng/blob/17.12.0/src/app/components/fileupload/fileupload.ts#L563C1-L564C1

Environment

Reproducer

No response

Angular version

17.3.x

PrimeNG version

17.12.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v20.12.0

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[kubedan]

I changed the source code of the fileupload.ts file and it works.
https://stackblitz.com/edit/uc6ex8

--- a/src/app/components/fileupload/fileupload.ts
+++ b/src/app/components/fileupload/fileupload.ts
@@ -572,7 +572,7 @@
             this.checkFileLimit();
         }
 
-        if (this.hasFiles() && this.auto && (!(this.mode === 'advanced') || !this.isFileLimitExceeded())) {
+        if (this.hasFiles() && this.auto && (this.mode !== 'advanced' || !this.isFileLimitExceeded())) {
             this.upload();
         }
 

Edit 23/04/2024:
This is just a suggested fix.

[manshy099]

Hello,

I am faceing the same problem with "primeng": "17.10.0" and updated it to "primeng": "17.13.0", but is not fixed the problem.

Auto-update is only working with mode:"basic"

I used your code https://stackblitz.com/edit/uc6ex8 as a guide but it did not worked for me.

<p-fileUpload [mode]="'advanced'" [auto]="true" [customUpload]="true" name="demo[]" (uploadHandler)="uploadHandler($event)" [multiple]="false" accept="image/*" ></p-fileUpload>

"@angular/core": "^17.2.0",
"primeflex": "^3.3.1",
"primeicons": "^6.0.1",
"primeng": "^17.13.0",

Thanks in advance.

[gbarrionuevo]

bump

[kubedan]

Hello,

I am faceing the same problem with "primeng": "17.10.0" and updated it to "primeng": "17.13.0", but is not fixed the problem.

Auto-update is only working with mode:"basic"

I used your code https://stackblitz.com/edit/uc6ex8 as a guide but it did not worked for me.

<p-fileUpload [mode]="'advanced'" [auto]="true" [customUpload]="true" name="demo[]" (uploadHandler)="uploadHandler($event)" [multiple]="false" accept="image/*" ></p-fileUpload>

"@angular/core": "^17.2.0", "primeflex": "^3.3.1", "primeicons": "^6.0.1", "primeng": "^17.13.0",

Thanks in advance.

I didnt fix it to primeng repository, so the issue in PrimeNG still exists. My code is just a proposed fix.

If you need to fix it in your project, you must copy the source code of the fileupload component, fix it, and import the corrected version. I did the same at https://stackblitz.com/edit/uc6ex8.
Specifically, I copied the files
https://raw.githubusercontent.com/primefaces/primeng/17.12.0/src/app/components/fileupload/fileupload.css to app/primeng/fileupload.css,
https://raw.githubusercontent.com/primefaces/primeng/17.12.0/src/app/components/fileupload/fileupload.ts to
app/primeng/fileupload.ts,
https://raw.githubusercontent.com/primefaces/primeng/17.12.0/src/app/components/fileupload/fileupload.interface.ts to app/primeng/fileupload.interface.ts.

Then, in the app.module.ts file, I imported the FileUploadModule from the project itself."