jQuery auto upload file

Question

I want the file input will automatic upload my image without enter any submit button.

<form action="/upload/" method="post" enctype="multipart/form-data">
  <input type="hidden" name="user_id" value="47" />
  <input type="file" name="upload" />
</form>

Let me know the trick with jQuery

karim79 · Accepted Answer · 2010-12-18 04:00:14Z

18

You can submit the form on the file input's onchange event, like this:

$("input[name=upload]").change(function() {
    $(this).closest("form").submit();
});

answered Dec 18, 2010 at 4:00

karim79

343k67 gold badges420 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Blur Over a year ago

wonderful jquery ;) if possible how do I display loading bar while uploading until it done?

Blur Over a year ago

Got it ;) $("#upload").change(function(){$(this).closest("form").submit();$('#loader').show();$(this).hide();});

lambinator · Accepted Answer · 2011-10-08 18:52:02Z

7

With more recent versions you can also just set the autoUpload option to true:

$('#fileupload').fileupload({ autoUpload: true });

answered Oct 8, 2011 at 18:52

lambinator

11.1k8 gold badges58 silver badges60 bronze badges

1 Comment

jerrygarciuh Over a year ago

In the file js/main.js

Collectives™ on Stack Overflow

jQuery auto upload file

2 Answers 2

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related