ich habe im Internet nun nach längerer Zeit ein jQuery Script gefunden, welches es ermöglicht, einen Fortschrittsbalken für ein Upload Formular anzuzeigen.
Nun habe ich das original PHP Upload Script von ilch 1.0.5 archiviert und mir ein neues geschrieben, in welchem ich etwas flexibler arbeiten kann. Im Grunde funktioniert auch alles, bis auf die Tatsache, dass nach dem Upload die komplette Seite als Resultat eingebunden wird.
Wie sollte das ganze funktionieren?
Es gibt ein Multifile Upload Formular, in welchem man die gewünschten Dateien von seinem Rechner/Smartphone auswählt. Nachdem auswählen, drückt man nur noch auf den Hochladen Button, womit die Fortschrittsanzeige aktiviert wird und von 0% auf 100% hochzählt. Nachdem die Dateien angekommen sind, soll nun nur noch ein Resultat ausgegeben werden, dass Datei xyz erfolgreich hochgeladen wurden.
Dies funktioniert so auch, nur dass das Resultat nicht nur die Meldungen anzeigt, sondern die komplette Seite wieder einbindet. Es sieht also sehr danach aus, als ob hier wieder header gesendet werden, obwohl dies nicht passieren soll.
Nun zum Code:
upload.php
<?php defined ('main') or die ( 'no direct access' ); defined ('admin') or die ( 'only admin access' ); // Upload Ordner nach Dateitypen sortiert $main_dir = 'include/downs/public-upload/'; $files = $main_dir.'files/'; $images = $main_dir.'images/'; $media = $main_dir.'media/'; $video = $main_dir.'video/'; // Dateiendungen $files_ext = array('apk','exe','doc','docx','docm','gadget','html','ini','pdf','php','rar','sh','txt','xlsx','zip'); $images_ext = array('gif','jpg','JPG','jpe','jpeg','JPEG','png','PNG'); $media_ext = array('mp3','ogg','wav'); $video_ext = array('avi','mp4','3gp'); $up = ( empty($_REQUEST['up']) ? '' : $_REQUEST['up'] ); switch ($_REQUEST['up']) { // Standard Upload Seite (ohne Formular) default : $tpl = new tpl ( 'admin/pupload/pupload_main' ); $tpl->out(0); break; // Upload Formular case 'upload' : $tpl = new tpl ( 'admin/pupload/pupload_upload' ); $msg = ''; // Schreibrechte des Upload Ordners überprüfen if (!is_writeable ('include/downs/public-upload')) { $msg = '<b>Bevor du hier eine Datei hochladen/verwalten kannst muss der Ordner include/downs/<b>public-upload</b>/ erstellt werden und er muss Schreibrechte ( chmod 777 ) erhalten !!! Wenn das geschehen ist einfach nochmal hier auf aktualisieren klicken</b>'; } // Jetzt kann es losgehen if ($_SERVER['REQUEST_METHOD'] == 'POST' and isset($_FILES['files'])) { // Loop durch alle Dateien foreach ( $_FILES['files']['name'] as $i => $name ) { $pathinfo = pathinfo($name); // Wenn die Datei nicht hochgeladen werden konnte, dann ueberspringen if ( !is_uploaded_file($_FILES['files']['tmp_name'][$i]) ) continue; // Jetzt werden die Dateien in den dafuer vorgesehenen Ordner verschoben // IMAGES if (in_array($pathinfo['extension'], $images_ext)) { if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $images . $name) ) { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">erfolgreich hochgeladen</font><br />'; } else { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">nicht erfolgreich hochgeladen</font><br />'; } // FILES } else if (in_array($pathinfo['extension'], $files_ext)) { if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $files . $name) ) { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">erfolgreich hochgeladen</font><br />'; } else { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">nicht erfolgreich hochgeladen</font><br />'; } // VIDEOS } else if (in_array($pathinfo['extension'], $video_ext)) { if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $video . $name) ) { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">erfolgreich hochgeladen</font><br />'; } else { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">nicht erfolgreich hochgeladen</font><br />'; } // MEDIA } else if (in_array($pathinfo['extension'], $media_ext)) { if ( move_uploaded_file($_FILES['files']['tmp_name'][$i], $media . $name) ) { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#00FF00">erfolgreich hochgeladen</font><br />'; } else { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">nicht erfolgreich hochgeladen</font><br />'; } } else { $msg .= '<b>Datei ' .($i+1). ':</b> ' . $name . ' (' . niceBytes($_FILES['files']['size'][$i]) . ' ) <font color="#FF0000">Trägt eine nicht unterstützte Endung</font><br />'; } } } // Folgendes ist auskommentiert, da sonst das Resultat doppelt ausgegeben wird //$tpl->set_ar_out(array('msg' => $msg), 0); // Template Ende $tpl->out(1); echo $msg; break; // Ordner Einstellungen case 'settings' : $tpl = new tpl ( 'admin/pupload/pupload_settings' ); $tpl->out(0); break; } ?>
pupload_upload.htm
<div id="main"> <form id="pupload" name="pupload" action="?ftx=pupload&up=upload" method="POST" enctype="multipart/form-data"> <fieldset class="tabulated"> <table id="down" class="bbcode_table" cellspacing="1"> <thead> <tr class="Cnorm"> <td><input type="file" name="files[]" multiple="multiple" id="files"></td> </tr> </thead> <tbody> <tr class="Cmite"> <td><input id="submit" class="button1" type="submit" value="Hochladen"></td> </tr> </tbody> </table> </fieldset> </form> <div class="progress"> <div class="bar"></div> <div class="percent">0%</div> </div> <div id="status"></div> </div><script type="text/javascript" src="include/includes/js/pupload.js"></script>
pupload.js (jQuery Script)
(function() { "use strict"; var bar = $('.bar'); var percent = $('.percent'); var status = $('#status'); $('#pupload').ajaxForm({ beforeSend: function() { status.empty(); var percentVal = '0%'; bar.width(percentVal); percent.html(percentVal); }, uploadProgress: function(event, position, total, percentComplete) { var percentVal = percentComplete + '%'; bar.width(percentVal); percent.html(percentVal); }, success: function(data, statusText, xhr) { var percentVal = '100%'; bar.width(percentVal); percent.html(percentVal); status.html(xhr.responseText); }, error: function(xhr, statusText, err) { status.html(err || statusText); } }); })();
Ich vermute mal, dass ich hier ein Problem mit dem Template und/oder das ganze mit dem {EXPLODE} noch nicht so richtig verstanden habe. Es könnte aber auch sein, dass ich einfach nur vor lauter Bäumen den Wald nicht sehe.
Hat hier eventuell jemand einen Rat für mich, oder weiß mich in die richtige Richtung zu schupsen?
Ich bin für jede Hilfe dankbar, die ich hier von den Kundigen bekommen kann.
Grüße
Chris
verwendete ilch Version: 1.0.5