HTML input file selection event not firing upon selecting the same file

dom-events, forms, html, javascript

Solution

Set the value of the `input` to `null` on each `onclick` event. This will reset the `input`'s value and trigger the `onchange` event even if the same path is selected.

var input = document.getElementsByTagName('input')[0];

input.onclick = function () {
  this.value = null;
};
  
input.onchange = function () {
  console.log(this.value);
};
<input type="file" value="C:\fakepath">

Note: It's normal if your file is prefixed with 'C:\fakepath'. That's a security feature preventing JavaScript from knowing the file's absolute path. The browser still knows it internally.

Problem

Is there any chance to detect every file selection the user made for an HTML `input` of type `file` element? This was asked many times before, but the usually proposed `onchange` event doesn't fire if the user select the same file again.

Original source

Related problems