first commit

2021-09-13 06:53:04 -04:00
commit 32eb3ab418
3602 changed files with 875408 additions and 0 deletions
@@ -0,0 +1,140 @@
+<?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;
+
+?>