Update php_upload/upload.php

This commit is contained in:
2024-07-04 17:12:58 +01:00
parent 62fd176228
commit ce6dd6d14c
+51 -6
View File
@@ -4,8 +4,11 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Test Upload</title> <title>Test Upload</title>
<!-- Bootstrap CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
</head> </head>
<body> <body>
<div class="container mt-5">
<h2>Upload a Large File</h2> <h2>Upload a Large File</h2>
<?php <?php
@@ -21,12 +24,20 @@
<p><strong>Maximum Execution Time:</strong> <?php echo $max_execution_time; ?> seconds</p> <p><strong>Maximum Execution Time:</strong> <?php echo $max_execution_time; ?> seconds</p>
<p><strong>Memory Limit:</strong> <?php echo $memory_limit; ?></p> <p><strong>Memory Limit:</strong> <?php echo $memory_limit; ?></p>
<form action="test_upload.php" method="post" enctype="multipart/form-data"> <form id="uploadForm" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post" enctype="multipart/form-data">
Select file to upload: <div class="form-group">
<input type="file" name="fileToUpload" id="fileToUpload"> <label for="fileToUpload">Select file to upload:</label>
<input type="submit" value="Upload File" name="submit"> <input type="file" class="form-control" name="fileToUpload" id="fileToUpload">
</div>
<button type="submit" class="btn btn-primary" name="submit">Upload File</button>
</form> </form>
<div class="progress mt-3">
<div class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div id="uploadStatus" class="mt-3"></div>
<?php <?php
if ($_SERVER['REQUEST_METHOD'] == 'POST') { if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$target_dir = "uploads/"; $target_dir = "uploads/";
@@ -39,11 +50,45 @@
// Move uploaded file to the target directory // Move uploaded file to the target directory
if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) { if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
echo "The file ". basename($_FILES["fileToUpload"]["name"]). " has been uploaded."; echo "<script>document.getElementById('uploadStatus').innerHTML = 'The file " . basename($_FILES["fileToUpload"]["name"]) . " has been uploaded.';</script>";
} else { } else {
echo "Sorry, there was an error uploading your file."; echo "<script>document.getElementById('uploadStatus').innerHTML = 'Sorry, there was an error uploading your file.';</script>";
} }
} }
?> ?>
</div>
<!-- jQuery and Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
$('#uploadForm').on('submit', function(e){
e.preventDefault();
var formData = new FormData(this);
$.ajax({
xhr: function() {
var xhr = new window.XMLHttpRequest();
xhr.upload.addEventListener("progress", function(evt) {
if (evt.lengthComputable) {
var percentComplete = Math.round((evt.loaded / evt.total) * 100);
$('.progress-bar').width(percentComplete + '%');
$('.progress-bar').attr('aria-valuenow', percentComplete);
}
}, false);
return xhr;
},
type: 'POST',
url: '<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>',
data: formData,
contentType: false,
processData: false,
success: function(response) {
$('#uploadStatus').html(response);
}
});
});
});
</script>
</body> </body>
</html> </html>