0

I am trying to have a file input which accepts only excel file.

<div mat-dialog-content class="p-24 pb-0 m-0" fusePerfectScrollbar>
            <div fxLayout="row" style="margin-top: 1rem;">
                <input type="file" accept=".xlsx, .xls, .csv" (change)="uploadFile($event)">
            </div>
</div>

in TS file-

uploadFile(event): void {
        const fileForm = event.target.files[0];
        this.formDataForm.append('file', fileForm);
    }

I want to restrict the user from uploading any type of other file, but any file type is uploaded now. accept attribute is not working here.

Ashad peal
  • 73
  • 10
  • Tip: Do not use this attribute as a validation tool. File uploads should be validated on the server. from https://www.w3schools.com/tags/att_input_accept.asp#:~:text=Definition%20and%20Usage,be%20validated%20on%20the%20server. – Siddharth Seth Jun 25 '22 at 11:07
  • @SiddharthSeth got it, but I want to add a file type validation in client side also. – Ashad peal Jun 25 '22 at 11:12
  • 2
    Check this answer: https://stackoverflow.com/questions/11832930/html-input-file-accept-attribute-file-type-csv –  Jun 25 '22 at 12:07

0 Answers0