PHP-und HTML-multi-Datei-upload mit progress bar
Ich habe eine website, die ermöglicht, dass mehrere Dateien hochgeladen werden, die mithilfe von HTML5, mehrere Einstellung. Ich verwende ein PHP-Skript zum validieren der Dateien und laden Sie Sie. Mit nur PHP und HTML/CSS ich würde gerne eine Fortschrittsanzeige für die Datei (oder Dateien) hochgeladen werden. Wie kann ich das erreichen? Ich weiß, kann PHP APC zu bekommen, Datei-upload info, aber wie kann das sein aufgenommen für mehrere Dateien hochgeladen werden?
<html>
<head>
<style type="text/css" media="screen">
div#banner_left {
position: absolute;
top: 0%;
left: 0%;
width: auto;
}
div#banner_right {
float: right;
width: auto;
}
</style>
<link rel="stylesheet" type="text/css" href="/css/structure.css">
</head>
<?php
echo "<div id='banner_right'>Welcome ";
echo $_SESSION['myusername'];
echo "<br><form action='/logout.php'>";
echo " <input type='submit' value='Logout' style='width:216px; font-size: 15px;'>";
echo "</form>";
echo "</div><br><br>";
?>
<!-- FILE UPLOAD SCRIPT//-->
<?php
if(isset($_POST['submit']))
{
$subject_list = $_POST['subject_list'];
$document_type = $_POST['document_type'];
$uploaddir = "/var/www/rye-high-website/Rye High/uploads/$subject_list/$document_type";
$files=array();
$fdata=$_FILES['rye_file'];
if(is_array($fdata['name'])){
for($i=0;$i<count($fdata['name']);++$i){
$files[]=array(
'name' => $fdata['name'][$i],
'tmp_name' => $fdata['tmp_name'][$i],
);
}
}
else $files[]=$fdata;
foreach ($files as $file) {
//uploaded location of file is $file['tmp_name']
//original filename of file is $file['name']
$move_file = move_uploaded_file($file['tmp_name'], "$uploaddir/".$file['name']);
}
if ($subject_list == "None") {
echo '<br><div class="alert">Please Pick A Course Code</div>';
}
if ($document_type == "None"){
echo '<br><div class="alert">Please Pick A Document Type</div>';
}
if($move_file){
echo '<br><div class="info">File is valid, and was successfully uploaded to: $subject_list folder</div>';
}
else {
echo '<br><div class="alert">Upload Failed</div>';
echo $move_file;
}
}
?>
<!-- CONTINUE WITH HTTP FORM//-->
<body>
<div id="banner_left">
<img src="/Rye High/images & scripts/logo_ryerson.gif"/>
</div>
<br><br><div class="img">
<img src="/images/logo.png" />
</div><center>
<form enctype="multipart/form-data" action="<?php echo htmlentities($_SERVER['REQUEST_URI']); ?>" method="POST">
Choose Document Type:
<select name="document_type">
<option value="None">Pick Document Type</option>
<option value="Textbooks">Text Books</option>
<option value="Notes & Assignments">Assignment/Notes</option>
</select><br>
Choose Course Code:
<select name="subject_list">
<option value="None">Pick Course</option>
<option value="ACC 100">ACC 100</option>
<option value="ACC 406">ACC 406</option>
</select><br>
Choose file(s) to upload (Max 500MB): <input name="rye_file[]" type="file" id="multiple" multiple />
<input type="submit" name="submit" value="Upload" />
</form>
Ich Schätze Ihre Hilfe,
P. S. ich würde es vorziehen zu vermeiden, mit javascript, seitdem ich bin nicht vertraut mit es auch genug. PHP und HTML/HTML5 bevorzugt.
- Hier ist ein Jquery-plugin mit Unterstützung für multi-Datei-uploads und-progressbars kann es hilfreich sein. dropzonejs.com
- Ich glaube nicht, dass dies möglich ist ohne JavaScript. Sie müssen manipulieren des DOM, ohne die Seite aktualisieren (IE Aufhebung der Datei-upload)
- progress-bar benötigt JS. Ein weiteres plugin können Sie verwenden : blueimp.github.io/jQuery-File-Upload
Du musst angemeldet sein, um einen Kommentar abzugeben.
Sparen Sie sich eine Menge Kampf, wenn Sie javascript verwenden, um das Problem zu lösen! Unter ist ein link zu einem tutorial, vielleicht nehmen Sie das beste aus, und suchen Sie auf google.
http://www.w3bees.com/2013/10/file-upload-with-progress-bar.html
http://hayageek.com/jquery-multiple-file-upload/