How to deselect html files?

Question

I have a simple php file upload form, something like this:

<form action="upload_file.php" method="post" onsubmit="return validateForm()" enctype="multipart/form-data"> <label for="file">Files:</label> <input type="file" name="file[]" id="file"><button type="button">Remove File</button> <input type="file" name="file[]" id="file"><button type="button">Remove File</button> <input type="submit" name="submit" value="Submit"> </form> 

and I would like to add the “Delete file” function to deselect the selected file. Is it possible?

Thanks for the help.

Answer 1

You will need to add identifiers to simplify them, otherwise you will navigate through the nodes and you will not like it.

 <form action="upload_file.php" method="post" onsubmit="return validateForm()" enctype="multipart/form-data"> <label for="file">Files:</label> <input id="file1" type="file" name="file[]" /> <button id="rmv1" type="button">Remove File</button> <input id="file2" type="file" name="file[]" /> <button id="rmv2" type="button">Remove File</button> <input type="submit" name="submit" value="Submit"> </form> 

Then add javascript to restore the defaults:

 document.getElementById('rmv1').onclick = function() { var file = document.getElementById("file1"); file.value = file.defaultValue; } 

(change rmv1 to rmv2 and file1 to file2 for another button)