happypete 16 Posted March 31 Hi, I have an drag and drop image upload script that will process multiple image uploads with PHP, the JS gives a notification of each file uploaded. I want to be able to give an "all files uploaded" notification at the end ... index.php <script src="upload.js"></script> </head> <body> <h2>Upload a new image.</h2> <!-- DROP ZONE --> <div id="uploader"> <div class="drop">Drop Files Here</div> </div> upload.js /* !! UPDATE : AJAX IS ASYNCHRONOUS !! */ /* We do not want users to dump 100 files & upload all at the same time */ /* This will create sort of a queue system & upload one at a time */ var upcontrol = { queue : null, // upload queue now : 0, // current file being uploaded start : function (files) { // upcontrol.start() : start upload queue // WILL ONLY START IF NO EXISTING UPLOAD QUEUE if (upcontrol.queue==null) { // VISUAL - DISABLE UPLOAD UNTIL DONE upcontrol.queue = files; document.getElementById('uploader').classList.add('disabled'); // PROCESS UPLOAD - ONE BY ONE upcontrol.run(); } }, run : function () { // upcontrol.run() : proceed upload file var xhr = new XMLHttpRequest(), data = new FormData(); data.append('file-upload', upcontrol.queue[upcontrol.now]); xhr.open('POST', 'process.php', true); xhr.onload = function (e) { // SHOW UPLOAD STATUS var fstat = document.createElement('div'), txt = upcontrol.queue[upcontrol.now].name + " - "; if (xhr.readyState === 4) { if (xhr.status === 200) { // SERVER RESPONSE txt += xhr.responseText; } else { // ERROR txt += xhr.statusText; } } fstat.innerHTML = txt; document.getElementById('upstat').appendChild(fstat); // UPLOAD NEXT FILE upcontrol.now++; if (upcontrol.now < upcontrol.queue.length) { upcontrol.run(); } // ALL DONE // // // I WANT TO ADD SOME CODE HERE TO CREATE A MESSAGE ON THE INDEX.PHP TO SAY ALL IMAGES UPLOADED // // // else { upcontrol.now = 0; upcontrol.queue = null; document.getElementById('uploader').classList.remove('disabled'); } }; xhr.send(data); } }; Quote Share this post Link to post Share on other sites
requinix 813 Posted March 31 Okay, well, else { upcontrol.now = 0; upcontrol.queue = null; document.getElementById('uploader').classList.remove('disabled'); } there's the code that runs when all the files are uploaded, so... put your notification in there. Whatever the notification is, given you didn't post that part. Quote Share this post Link to post Share on other sites
happypete 16 Posted April 1 Awesome thanks, that's just want I needed to know. Quote Share this post Link to post Share on other sites
