I basically do a simple ajax request
function upload(){ setInterval(function callMeOften() { $.ajax({ method: 'get', url : 'uploadinfo.php?unique_id=<?php echo $some_uniq_id; ?>', dataType : 'text', success: function(text){ updatebar(text); }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(XMLHttpRequest.status); alert(XMLHttpRequest.responseText); } }); }, 5000); } function updatebar(per){ $('#updateMe').animate({"width" : per}); }
PHP script
$unique_id = $_GET['unique_id']; $progress = uploadprogress_get_info($unique_id); if(function_exists("uploadprogress_get_info")) { if (floor(($progress['bytes_total']/1024)/1024) > 100){ echo "run"; } else { if ($progress['bytes_uploaded'] == 0 || $progress['bytes_total'] == 0){ echo "100"; } else { echo floor($progress['bytes_uploaded'] / $progress['bytes_total'] * 100); } }
}
This function upload (); called using onsubmit (); file upload form action
<form id="something" onsubmit="upload();" action="status.php" enctype="multipart/form-data" method="post">
I use relative paths and the request works in FF and IE, but in chrome, safari and opera, ajax requests don't even start at boot time.
What's happening?
EDIT: In the end, I just showed the download progress in a separate window, which was created using the onsubmit action and redone and moved to the center of the screen, it looks good and today is the easiest way.
source share