Jquery: change event to input file on IE

events, internet-explorer, javascript, jquery

Solution

I know this is several months late, but I just ran into the exact same behavior in IE7; in all other browsers, the change event for file inputs happens after file selection. In IE7, it happens only if you trigger the file select again, or on blur.

Here's how I ended up fixing it:

var $input = $('#your-file-input-element');

var someFunction = function()
{
    // what you actually want to do
};

if ($.browser.msie)
{
    // IE suspends timeouts until after the file dialog closes
    $input.click(function(event)
    {
        setTimeout(function()
        {
            if($input.val().length > 0) {
              someFunction();
            }
        }, 0);
    });
}
else
{
    // All other browsers behave
    $input.change(someFunction);
}

Technically you could/should filter the hack condition to just IE7, since IE8 behaves properly on the change event, but it also has the same behavior as IE7 on suspending timeouts while browser-related chrome is visible (I guess it considers it blocking I/O), so it works as-is.

Problem

I have a form to upload files, and it should fire the submit after the file selection. On FireFox/Chrome it goes well, and submits the form after file selection, but I can't do this on Internet Explorer. Already tried with click/propertychange but nothing happens. Some code I already tried: ``` $("#attach").attr("onChange", "alert('I changed')"); ``` ``` $("#attach").live($.browser.msie? 'propertychange': 'change', function(e) { ... }); ``` This input file is created on the fly; because of it I use `.live()` to bind the event. Any suggestions?

Original source

Related problems