0
840
ViewsKendo-Angular: Disable select file button in kendo-upload
I have implemented kendo upload in my angular project
component.html
<kendo-upload
#upload
[autoUpload]="false"
(select)="onSelectEvent($event)"
(remove)="onRemoveEvent($event, upload)"
(upload)="onUploadEvent($event)"
[multiple]="false"
[restrictions]="myRestrictions">
</kendo-upload>
I want to disable the 'Select file' button once the file is selected as in picture and enable once user clicks on clear button or 'X'.
Please help me with your suggestions as I'm new to Kendo and couldn't find documentation.
·
Santiago Trujillo
1 answers
Answer question0
The file upload offers a disable attribute. Here is a demo:
https://www.telerik.com/kendo-angular-ui/components/uploads/upload/disabled-state/
So for example:
<kendo-upload [disabled]="hasFile$ | async"> </kendo-upload>
Where hasFile$ is:
public hasFile$ = new BehaviorSubject(false);
If you only use a boolean instead of an observable the change detection won't pick it up
To only disable the button and not the rest of the upload:
(this.upload.fileSelectButton.nativeElement as HTMLElement).classList.add('k-state-disabled');
·
Santiago Trujillo
Report
Answer question