Event onChange won't trigger after files are selected from code-generated INPUT element

Question

I\'m playing with JavaScript and wrote simple function that creates INPUT element (type=\"file\") and simulates click.

var createAn         


        

Answer 1

This happens because your input element no longer exist when you close "Open file" dialog window, so there is no target on whom to raise the onchange event. Maybe because JavaScript's garbage collector already collected this element, or by some other reason.

To fix this just save your input element somewhere in the DOM:

input.style.visibility='hidden';
document.body.appendChild(input);

Also don't forget to save link to this element and delete it from DOM when file upload completes (I use here this.set() and this.get() functions from Ext.js):

// after element initialization:
this.set("inputFileElement", input);
...
// in the "OnFileComplete" event handler or in some similar place:
var inputFileElement = this.get("input");
if(inputFileElement !== null && inputFileElement !== undefined)
{
    inputFileElement.parentNode.removeChild(inputFileElement);
}