Я пытаюсь загрузить файлы в свою папку загрузки с этим кодом, но когда я нажимаю кнопку «загрузить», ничего не происходит, страница остается такой, как есть.Папка для загрузки остается пустой, и я не вижу изображения на своей странице.Может кто-нибудь, пожалуйста, попробуйте этот код в своей системе и дайте мне знать, в чем может быть проблема.Пожалуйста, помогите
мой index.php
<?php
//index.php
?>
<!DOCTYPE html>
<html>
<head>
<title>How to Upload a File using Dropzone.js with PHP</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/dropzone.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/dropzone.js"></script>
</head>
<body>
<div class="container">
<br />
<h3 align="center">How to Upload a File using Dropzone.js with PHP</h3>
<br />
<form action="upload.php" class="dropzone" id="dropzoneFrom">
</form>
</form>
<br />
<br />
<div align="center">
<button type="button" class="btn btn-info" id="submit-all">Upload</button>
</div>
<br />
<br />
<div id="preview"></div>
<br />
<br />
</div>
</body>
</html>
<script>
$(document).ready(function(){
Dropzone.options.dropzoneFrom = {
autoProcessQueue: false,
acceptedFiles:".png,.jpg,.gif,.bmp,.jpeg",
init: function(){
var submitButton = document.querySelector('#submit-all');
myDropzone = this;
submitButton.addEventListener("click", function(){
myDropzone.processQueue();
});
this.on("complete", function(){
if(this.getQueuedFiles().length == 0 && this.getUploadingFiles().length == 0)
{
var _this = this;
_this.removeAllFiles();
}
list_image();
});
},
};
list_image();
function list_image()
{
$.ajax({
url:"upload.php",
success:function(data){
$('#preview').html(data);
}
});
}
$(document).on('click', '.remove_image', function(){
var name = $(this).attr('id');
$.ajax({
url:"upload.php",
method:"POST",
data:{name:name},
success:function(data)
{
list_image();
}
})
});
});
</script>
и upload.php
<?php
//upload.php
$folder_name = 'upload';
if(!empty($_FILES))
{
$temp_file = $_FILES['file']['tmp_name'];
$location = $folder_name . $_FILES['file']['name'];
move_uploaded_file($temp_file, $location);
}
if(isset($_POST["name"]))
{
$filename = $folder_name.$_POST["name"];
unlink($filename);
}
$result = array();
$files = scandir('upload');
$output = '<div class="row">';
if(false !== $files)
{
foreach($files as $file)
{
if('.' != $file && '..' != $file)
{
$output .= '
<div class="col-md-2">
<img src="'.$folder_name.$file.'" class="img-thumbnail" width="175" height="175" style="height:175px;" />
<button type="button" class="btn btn-link remove_image" id="'.$file.'">Remove</button>
</div>
';
}
}
}
$output .= '</div>';
echo $output;
?>