Cult-Foo

Multiple file Uploaders

Tags: ,

Have you ever want to upload multiple files at once, or see file upload progress, or style your upload elements, or control filetypes before upload ? Today i want to suggest you a collection of file uploaders ready to use in your web projects.

FancyUpload


They divided into 2 groups: uploaders not using flash & uploaders using flash

Solutions without flash

1. Ajax upload

Ajax upload

Very nice tool, flash-free. You can customize it as you want, also you can use drag&drop files on input
Works in: IE6/7, FF2/3, Safari, Chrome, Opera.
Has different versions for jQuery, Prototype, plus has independent version.
demo

2. jQuery Multiple File Upload Plugin

jQuery Multiple File Upload Plugin

Has many features, like using different validations, limit max files for upload, use different icons for different file types
demo

3. Ext.ux.FileTreePanel (Ext.JS extension)

Ext.ux.FileTreePanel

demo

4. noswfupload

noswfupload

Multiple files upload without SWF objects, applets Java, or other third parts plug-ins, 100% browser and W3 compatibility thanks to graceful enhancement, no extra libraries dependency

demo

Solutions using flash

1. SWF Upload

swfupload

Popular solution, allows to customize all upload elements using XHTML & CSS, shows only file types you choose, has js callback function to every event.
demo

2. uploadify

uploadify

Has not so many features, as SWFUpload, but it uses jQuery :)
demo

3. FancyUpload

FancyUpload

FancyUpload – fully customizable uploader with progress bar. Require MooTools.
demo

4. Yahoo File Upload

Yahoo File Upload

demo

Did you like it? Help us spread the word!

10 Responses to "Multiple file Uploaders"

  1. SWFUpload is a good uploader to use again.

  2. Robbie says:

    Very nice.
    Needed this for a project so this post is really handy :)

  3. your blog is beautiful and I just love the header

  4. isabel says:

    hi,
    i use an accordion mootools in a page. i would like that an external page, by a link#anchor, could open the accordion and show the specific part ….but didn’t work

    this is scirpt:

    window.onload = function() {
    accordionTogglers = document.getElementsByClassName(‘accToggler’);

    accordionTogglers.each(function(toggler){
    //remember the original color
    toggler.origColor = toggler.getStyle(‘background-color’);
    //set the effect
    toggler.fx = new Fx.Style(toggler, ‘background-color’);
    });

    accordionContents = document.getElementsByClassName(‘accContent’);

    accordion = new Fx.Accordion(accordionTogglers, accordionContents,{ start:’first-open’, alwaysHide:true,
    //when an element is opened change the background color to ….
    onActive: function(toggler){
    toggler.fx.start(‘#E7E8EA’);
    },
    onBackground: function(toggler){
    //change the background color to the original (green)
    //color when another toggler is pressed
    toggler.setStyle(‘background-color’, toggler.origColor);
    }
    });
    };

    ….

    h4>

    ………

    h4>

    here is the part that i woold like to show by an external page link

    could you help me please. thanks.

  5. biberhapi says:

    your blog is beautiful

  6. Abie says:

    how can i remove the progress bar can anyone know???? thanks in advance for answering… :)

  7. I think some of your graphics on this blog are brilliant, keep up the good work.

  8. Ares!!! says:

    NoSWFUpload is very cool plugin! Thank you, Andrea Giammarchi!

  9. Multi Upload says:

    Super…! Can i use this scripts on my wordpress web site?

  10. rajkishor says:

    we need code for multiple file uploading in core php .

Trackbacks/Pingbacks

Do you have something to say?