Count the number of files being uploaded? and count number uploaded so far?

[shortysbest]

I have am uploading files with iframes (to fake an ajax system) And I allow multiple photo uploads, Now I just want it to show the progress, either by percentage, or number of photos uploaded out of the total number.

 

my form is:

<form><input type="file" name="uploadFile[]" class="custom-upload" multiple="multiple" onChange="photoUpload(this.form,'ajax/profile/photos/photo_upload.php','photo', '<?php print $albumID?>'); return false;"/></form>

 

this is the javascript that makes it work:

//###########MULTIPLE PHOTOS///####////
function photoUpload(form, action_url, div_id, albumID)
{

// Create the iframe...
var iframe = document.createElement("iframe");
iframe.setAttribute("id","upload_iframe");
iframe.setAttribute("name","upload_iframe");
iframe.setAttribute("width","0");
iframe.setAttribute("height","0");
iframe.setAttribute("border","0");
iframe.setAttribute("style","width: 0; height: 0; border: none;");

// Add to document...
form.parentNode.appendChild(iframe);
window.frames['upload_iframe'].name="upload_iframe";

iframeId = document.getElementById("upload_iframe");

// Add event...
var eventHandler = function()  {

if (iframeId.detachEvent)
iframeId.detachEvent("onload", eventHandler);
else
iframeId.removeEventListener("load", eventHandler, false);

// Message from server...
if (iframeId.contentDocument) {
content = iframeId.contentDocument.body.innerHTML;
} else if (iframeId.contentWindow) {
content = iframeId.contentWindow.document.body.innerHTML;
} else if (iframeId.document) {
content = iframeId.document.body.innerHTML;
}
if(content)
{

document.getElementById(div_id).innerHTML = content;

//###################RESULT ACTIONS ON SUCCESS#################/


}
else
{
//###################ERROR RESULTS#############///
}

//$('#post-photo'+session).attr("src","photos/small_thumb/"+content);
// Del the iframe...
setTimeout('iframeId.parentNode.removeChild(iframeId)', 250);
}

if (iframeId.addEventListener)
iframeId.addEventListener("load", eventHandler, true);
if (iframeId.attachEvent)
iframeId.attachEvent("onload", eventHandler);

// Set properties of form...
form.setAttribute("target","upload_iframe");
form.setAttribute("action", action_url);
form.setAttribute("method","post");
form.setAttribute("enctype","multipart/form-data");
form.setAttribute("encoding","multipart/form-data");

// Submit the form...
form.submit();

//$(".upload-error").attr("class","add-photo-loading");
//$(".upload-photo-loading").html("Uploading...");

}

[phpSensei]

Like this one? PHP 5.2 has added C-level hooks for this type of function.

 

http://progphp.com/progress.php

 

http://blog.liip.ch/archive/2006/09/28/upload-progress-meter-extension-for-php-5-2.html

http://the-stickman.com/web-development/php/upload-progress-tracking-in-php52/

[shortysbest]

Well yeah, but also with multiple files. (images).

[phpSensei]

Hi there,

 

I am pretty sure you can figure out a simple way of integrating multiple uploads.

[shortysbest]

hadn't seen your edit, thanks.

[phpSensei]

Oh sorry about that,

 

Glad I helped

[phpSensei]

BTW, I also suggested to the OP on Private Message about an Ajax method, just so anyone else is interested

 

http://www.google.ca/search?sclient=psy&hl=en&source=hp&q=ajax+upload+progress+bar&aq=1&aqi=g3g-v2&aql=f&oq=&pbx=1&biw=1920&bih=883&cad=cbv