Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hide upload button PrimeNG

I'm using file upload from PrimeNG : https://www.primefaces.org/primeng/#/fileupload

For now, I have this enter image description here

But I would like to have only "Choose" and "Cancel" buttons. enter image description here

So on primeNG website, they say to use showUploadButton="false"

But it's not working.

Refering to this post : Remove File Upload and Cancel Button from Primefaces p:fileUpload

I tried :

<p-fileUpload ...  showButtons="false" showCancelButton="true"/>

then I tried

.ui-fileupload-buttonbar .ui-fileupload-upload {
    display: none;
}

Nothing works. Maybe it's because it was refering to another version. I'm using version of primeNG 2.0.6 and angular 2.4.0

like image 630
anais1477 Avatar asked Nov 28 '22 22:11

anais1477


2 Answers

You have to put the showUploadButton inside of a bracket for it to work.

<p-fileUpload [showUploadButton]="false"></p-fileUpload>

Result

EDIT: You need to get the latest version of PrimeNG to work with Angular 4. Since Angular launched their Angular 4, PrimeNG has also launched PrimeNG v4 to work with Angular 4

like image 86
Chau Tran Avatar answered Dec 05 '22 17:12

Chau Tran


have you tried to do like this:

<p:fileUpload ...  [showButtons]="false" [showCancelButton]="true"/>

Hope it helps you

like image 36
federico scamuzzi Avatar answered Dec 05 '22 19:12

federico scamuzzi