Event handler for when a user has added an image

Question

I have a form that lets users upload a image of them self. I need an jQuery event handler for when the input in uploaded.

<script>
  $('#imageFile').someeventhander(function(){do some work son!});
</script>

<input id="imageFile" type="file">

score 1 · Answer 1 · edited May 23 '17 at 10:32

1

This is a very complex problem, as file inputs do not upload until you submit a form. See this related question:

How can I upload files asynchronously?

edited May 23 '17 at 10:32

Community

1
1

answered Aug 13 '10 at 21:57

Ian Henry

22,255
4
50
61

Well i think I just found the answer. I didn't really want that much specificity for this. So .change I think will do the job. – JamesTBennett Aug 13 '10 at 22:00
Although that link is very helpful. :) – JamesTBennett Aug 13 '10 at 22:01

score 0 · Answer 2 · answered Aug 13 '10 at 22:19

0

$('#imageFile').change I believe is what I needed.

answered Aug 13 '10 at 22:19

JamesTBennett

2,091
6
19
22

score 0 · Accepted Answer · answered Aug 13 '10 at 23:28

To upload a file you need the server to accept it and send a response back to the browser. jQuery can then use the response to trigger an event or call a function. So the answer depends on how your server is handling the upload.

swfUpload is a popular solution that uses a small Flash movie the handling the uploading. There is a jQuery plugin for it that triggers numerous events that allow you to monitor start/progress/error/completion of the upload.

Event handler for when a user has added an image

3 Answers3