Home About Contact

Multiple file upload using jQuery and Flash

Posted by phorner On May 1, 2009

I was recently searching for a solution that would allow people to upload photos of their homes on Golf Home Exchange. The standard upload method using HTML forms and PHP was not good enough as their was no indication of progress. As a result, the users thought the system wasn’t responding or something had gone wrong when simply it was taking a while to upload the image. Many simply gave up and never finished the registration process.

Luckily I stumbled across Uploadify, developed by Ronnie Garcia. Uploadify is a jQuery plugin that allows the easy integration of multiple (or single) file uploads. By default, the standard File Upload dialog in browsers only allows for single selection of files. To circumvent this issue and enable multiple file uploading, Flash is used.

To get started, you will need to download the jquery.uploadify-v1.6.2.zip package, then unzip and upload the files to your website.

Then in your HTML, add this code:

<body>
<input type="file" name="fileInput" id="fileInput" />
<script type="text/javascript">
$(document).ready(function() {
$('#fileInput').fileUpload ({
'uploader'  : 'uploader.swf',
'script'    : 'upload.php',
'cancelImg' : 'cancel.png',
'auto'      : true,
'folder'    : '/uploads'
});
});
</script>
</body>

This will set up Uploadify in it’s basic form. There are a ton of parameters you can set, plus event listeners (e.g. onAllComplete – triggers when all the files in the queue have been uploaded).

You can provide your own styled upload button and specifying the path to it by using the buttonImg parameter. If you want to customise the look of the upload progress bars, you will need to go into the Uploadify FLA and modify that manually.

Uploadify

You can also specify whether multiple files upload simultaneously or one at a time.

The script parameter allows you to specify your server side code that gets executed once a file has finished uploading. The example provided is PHP but you could use any backend development language.

There is only one downside to Uploadify, and that is that it needs Flash Player installed. If a user doesn’t have Flash Player installed, then it won’t work. I’m still looking for a File Upload solution for instances where the user doesn’t have Flash Player installed. Can anyone point me in the right direction?

Apart from this small issue, Uploadify is a solid alternative to using the standard File Upload dialog.

For more information and documentation: Uploadify

  • Share/Bookmark

518 Responses to “Multiple file upload using jQuery and Flash”

  1. Please tell me it worked right? I dont want to sumit it again if i do not have to! Either the blog glitced out or i am an idiot, the second option doesnt surprise me lol. thanks for a great blog!

  2. I find myself coming to your blog more and more often to the point where my visits are almost daily now!

  3. I just book marked your blog on Digg and StumbleUpon.I enjoy reading your commentaries.

  4. Very Interesting Post! Thank You For Thi Blog!

  5. Kredyty says:

    Which golf clubs will be the best for beginner ?

  6. This is a really good read for me, Must admit that you are one of the best bloggers I ever saw.Thanks for posting this informative article.

  7. I hope you have a nice day! Very good article, well written and very thought out. I am looking forward to reading more of your posts in the future.

  8. I enjoyed reading this article. I want to read more on this subject.. Thank you for writing this amazing post.. Anyway, I’m going to subscribe to your feed and I hope you write great articles again soon.

  9. I definitely have the same opinion with you about this topic. Nice article. Already bookmarked for future purposes.

  10. Great Post!…

    [...] I found your entry interesting thus I’ve added a Trackback to it on my weblog :) [...]…

  11. Sok Noni says:

    Which golf clubs will be the best for beginner ?

  12. A friend of mine told me to check out your blog. This is precisely the kind of facts I was hunting for. I wish I have come across your site sooner.

  13. Noni says:

    Very Interesting Post! Thank You For Thi Blog!

  14. Hey – nice blog, just looking around some blogs, seems a pretty nice platform you are using. I’m currently using Wordpress for a few of my sites but looking to change one of them over to a platform similar to yours as a trial run. Anything in particular you would recommend about it?

  15. Sok Noni says:

    Very informative post. Thanks for taking the time to share your view with us.

  16. Kosmetyki says:

    You certainly have some agreeable opinions and views. Your blog provides a fresh look at the subject.

  17. I just sent this post to a bunch of my friends as I agree with most of what you’re saying here and the way you’ve presented it is awesome.

  18. Wow, very interesting article. It’s funny how history can be twisted in so many different ways. These photos certainly give us clues, but I guess we’ll never know the true story. . . .

  19. Diving says:

    Thanks For This Post, was added to my bookmarks.

  20. Easily, the article is actually the best topic on this registry related issue. I fit in with your conclusions and will eagerly look forward to your next updates. Just saying thanks will not just be sufficient, for the fantasti c lucidity in your writing. I will instantly grab your rss feed to stay informed of any updates.

  21. Kate Mara Hot Pictures says:

    Pretty good post. I just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts. Any way I’ll be subscribing to your feed and I hope you post again soon.

  22. I have been visiting variousblogs for my dissertation study. I have found your blog to be fairlybeneficial. Keep updating your blog with usefulinformation… Regards

  23. Thanks for taking the time to share this, I feel strongly about it and love reading more on this topic. If possible, as you gain knowledge, would you mind updating your blog with more information? It is extremely helpful for me.

  24. exe virus says:

    Cool, I am the first time on this site and am really enthusiastic about and so many good articles. I think it’s just very good. :D

  25. exe virus says:

    This is such a great resource that you are providing and you give it away for free. I love seeing websites that understand the value of providing a quality resource for free. It is the old what goes around comes around routine. Did you acquired lots of links and I see lots of trackbacks??

  26. Thank you so much for this valuable information. Very useful indeed. . . . .

  27. Considerably, the blog post is actually the greatest on this worthy topic. I concur with your decisions and will thirstily look forward to see your approaching updates. Saying thanks will not just be adequate, for the phenomenal lucidity in your writing. I will at once grab your feeds to stay informed of any updates. Delightful work and much success in your business endeavors! Have a nice day

  28. can i copy this blog post? i will link back to this post.. let me know please, thank you

  29. Very informative post. Thanks for taking the time to share your view with us.

  30. I love the blog. Great post. It is very true, people must learn how to learn before they can learn. lol i know it sounds funny but its very true. . .

  31. I wanted to thank you for this great read!! I definitely enjoying every little bit of it.I have you bookmarked to check out new stuff you post.

  32. Very Interesting Blog! Thank You For Thi Post!

  33. Been looking for this article for long time ago and finally found here. thanks for sharing this post. appreciate!

  34. wow, nice post, I was wondering how to cure acne naturally. and found your site by yahoo, many userful stuff here, now i have got some idea. I’ve bookmark your site and also add rss. keep us updated.

  35. Supra Chad Muska Skytop grey, Supra Chad Muska Skytop grey
    Supra Skytop Gucci Green Red, Supra Skytop Gucci Green Red
    Supra Chad Muska Skytop Black White, Supra Chad Muska Skytop Black White

  36. Aw, this was a really quality post. In theory I’d like to write like this too – taking time and real effort to make a good article… but what can I say… I procrastinate alot and never seem to get something done.

  37. I’ve really enjoyed reading your articles. You obviously know what you are talking about! Your site is so easy to navigate too, I’ve bookmarked it in my favourites. . . . .

  38. Easily, the post is actually the greatest on this deserving topic. I agree with your conclusions and will thirstily look forward to your coming updates. . . . .

  39. Considerably, the blog post is actually the greatest on this worthy topic. I concur with your decisions and will thirstily look forward to see your approaching updates. Saying thanks will not just be adequate, for the phenomenal lucidity in your writing. I will at once grab your feeds to stay informed of any updates. Delightful work and much success in your business endeavors! Have a nice day

  40. Hello… I can not access your rss feed… Something trouble? Can you fix it? Thanks

  41. Very useful informations about these subject. I have found them with googling and you seems number one of these subjects ! . . .

  42. Wow this takes me back. Adding to my bookmarks thanks.

  43. Cool, do you think i could use some parts of your article for a work of mine?

  44. Thank you so much for this valuable information. Very useful indeed. . . . .

  45. Hey, I’m having a problem viewing your site in my browser. Could you please check this. My browser is Opera 7 btw.

  46. I have some trouble to subscribe the rss feed, anyway I’ve bookmarked this site, is very useful and full of informations.

  47. Hi I found your site by mistake when i was searching yahoo for this acne issue, I must say your site is really helpful I also love the design, its amazing!. I don’t have the time at the moment to fully read your site but I have bookmarked it and also add your RSS feeds. I will be back in a day or two. thanks for a great site.

  48. Hi I found your site by mistake when i was searching yahoo for this acne issue, I must say your site is really helpful I also love the design, its amazing!. I don’t have the time at the moment to fully read your site but I have bookmarked it and also add your RSS feeds. I will be back in a day or two. thanks for a great site.

  49. Hello, this is my first time i visit here. I found so many interesting in your blog especially on how to determine the topic. keep up the good work.

Leave a Reply