How do I 'unselect' a selected file?

Issue

I’m using this to allow the user to select and upload a file:

<input id="fileInput" type="file" ng-file-select="onFileSelect($files)">

This correctly show:

enter image description here

When user clicks ‘Upload’, I upload the file.

When the user clicks ‘Remove’, how do I clear out the file name?

Solution

Simply clear the value of the file input element:

document.getElementById('remove').addEventListener('click', function () {
    document.getElementById('fileInput').value = ''
});

Here’s a demo

Answered By – raam86

Answer Checked By – Dawn Plyler (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.