Jquery Live Change Event not working with File Input

Question

Don't seem to be able to get this to work and not too sure why, for reference using JQuery 1.6.2.

I'm trying the below code:

    $("#imageUpload input").live('change', function() {
    var fileName = $(this).val();
    var fileExt = fileName.split('.').pop();
    var indexPos = $(this).parent().index();
    var currId = $(this).attr('id');

    // check extensions and if invalid replaceWith the input to clear

});

IE 6 - 9 no luck whatsoever (nothing in the function gets called), Firefox it works flawlessly. I did a bit of reading and read the live + change issue with IE was fixed in version 1.4+ of JQuery. Also have exactly the same issue using Delegate?

Any help appreciated.

Is this an issue with IE and the file input type?

In IE the change event in jQuery = to blur in classic javascript — David Laberge, Aug 15 '11 at 16:37
It seems similar to http://stackoverflow.com/questions/208471/getting-jquery-to-recognise-change-in-ie — David Laberge, Aug 15 '11 at 16:42

score 2 · Answer 1 · answered Nov 25 '11 at 06:06

I ran into this problem when redeveloping favikon. With the latest version of jQuery (1.7.1), IE7 and 8 would only fire the change event once. I ended up having to do this to get it to work:

Bind a standard change event (i.e. not live) to file input
When the change event fires, submit the form
Immediately destroy and create a new file input
Bind change event to the new file input

This jQuery bug seems to be related, so I assume it's still a problem with IE that jQuery hasn't been able to work around.

Removing the .live('change', function() { and just using .change(function() { worked for me in IE — shasi kanth, Nov 16 '12 at 05:32

Jquery Live Change Event not working with File Input

1 Answers1