CODEWITHSUNDEEP
javascriptjqueryhtmlfile
one stevy boi
one stevy boi

Reputation: 576

how does jquery detect a change to a file input element?

I am building an image-upload feature into a web application and am using the following event handler:

$('input:file').change(function(){
    //handle input change
});

I have discovered that the handler is not called if I try to upload the same image twice, which makes sense because technically the input is not changing. But I am wondering, what needs to happen in order for the change to be triggered? Here are some examples of what I am looking for:

Which of these would cause a file to be received as a changed file? Or are there other scenarios as well?

Upvotes: 2

Views: 988

Answers (1)

Shaunak D
Shaunak D

Reputation: 20626

Refer this Link.

Input type - File :

The onchange event is fired when the contents have changed. If the user types the path (does not use the Browse button) in Internet Explorer, then the onchange event is fired only when the element loses the focus. Therefore use the onpropertychange event to detect the modification in Internet Explorer.

MSDN reference

Fires when the contents of the object or selection have changed.

My test results :

  1. Change of filename : Change fires.
  2. Change of content : Keep the filename same, Change event does not fire.
  3. Change of filetype : Keep the filename same, Change fires.
  4. In IE 9,10, if you try to change the filename(in the input field), the change event is fired and the filename field is cleared.

So, moral of the story is, by content change they mean filename change.

Upvotes: 5

Related Questions