Simple PHP upload progress meter using Prototype

The uploadprogress extension is fairly simple to use – but it is important to note that on some PHP configurations it doesn’t function correctly and only returns a progress of 100%.

Upload progress screenshot

The JavaScript uses David Stone’s method for displaying percentage bars but you can modify the onCreate, onUpdate and onComplete callbacks if you want to use your own.

1) You will need uploadprogress >= 0.3.1 (0.3.0 does not seem to work for me), to build it from source (don’t forget to restart your webserver after installing):


cvs -d :pserver:cvsread@cvs.php.net:/repository checkout pecl/uploadprogress
cd pecl/uploadprogress && phpize && ./configure && make && sudo make install

2) Progress tracking is automatically enabled if you have a field named UPLOAD_IDENTIFIER with a unique ID in your file upload form:

<input type="hidden" name="UPLOAD_IDENTIFIER" value="<?php echo $uploadID; ?>" id="uploadIdentifier" />

3) You retrieve the upload progress with your UPLOAD_IDENTIFIER (obviously these calls will be AJAX requests):

$data = uploadprogress_get_info($uploadID);

Once the upload is complete the extension will remove the temporary file and further info calls will return null.

That’s it!

See the demo

Download the code

This entry was posted in Uncategorized and tagged , . Bookmark the permalink.

8 Responses to Simple PHP upload progress meter using Prototype

  1. Sumit says:

    Your example is incomplete. At what point do you actually move the uploaded file? I tried within the first if block since it seems to be setting the stage there for AJAX requests, but that kills the upload meter.

    The elseif is obviously for the AJAX request and then the else is the page itself. I don’t understand when you’re actually notified, via what function that is, that the file is done and ready to move.

  2. david says:

    Doesn’t work for IE7.
    Works perfectly on FF.
    What could be the problem?

  3. Felipe says:

    In that directory and in what time do you upload the file to the server?

  4. Abhinav says:

    Ok i figured out why it did not work. Try disabling Suhosion extension if installed. Then version 0.9.x will work just fine.
    Hope this helps.
    Cheers

  5. Abhinav says:

    Do you have the source of 0.3.1? or which ever version you have.
    Thanks

  6. Don.
    I installed your sample code on my server because I’d like to integrate it into an uploader for artists. It initially barfed as the uploadprogress extension was nor present. This I installed as per your instructions, although I had to first “yum -y install php-devel” just to get phpize.
    Now the script works except the progress bar shows no actual progress, just goes from 0% to 100% partway thru the upload. Also don’t get the uploadSpeed displayed.
    Any thoughts as to what I might be missing?
    PS. This runs on a PLESK managed server, PHP 5.2.6, Zend engine 2.2.0 and presumably the latest version of uploadprogress as per the install method.
    (how do I actually determine the version short of downloading a tarball?)
    Thanks,
    B.

  7. Don says:

    @Jonu: What version of the uploadprogress extension are you using?

  8. Jonu says:

    Does not work.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>