• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Ajax upload problem to save the file

#1
[eluser]Ludovic-r[/eluser]
Hi everyone!

I've tried to make an Ajax upload for a personal project and everything goes well except the PHP part to move the file in a folder

Here's the code :

THE HTML :

Code:
<div id="main">
  <h1>Upload Your Images</h1>
  &lt;form method="post" enctype="multipart/form-data"  action="&lt;?php echo base_url(); ?&gt;index.php/create_project/ajax_up"&gt;
    &lt;input type="file" name="images" id="images" multiple /&gt;
    <button type="submit" id="btn">Upload Files!</button>
   &lt;/form&gt;

<div id="response"></div>
  <ul id="image-list">

  </ul>
</div>

The image uploaded appears in the "response" div

THE JS :

Code:
(function () {
base_url = "&lt;?php echo base_url(); ?&gt;";

var input = document.getElementById("images"),
  formdata = false;

function showUploadedItem (source) {
    var list = document.getElementById("image-list"),
     li   = document.createElement("li"),
     img  = document.createElement("img");
    img.src = source;
    li.appendChild(img);
  list.appendChild(li);
}  

if (window.FormData) {
    formdata = new FormData();
    document.getElementById("btn").style.display = "none";
}

  input.addEventListener("change", function (evt) {
   document.getElementById("response")[removed] = "Uploading . . ."
   var i = 0, len = this.files.length, img, reader, file;

  for ( ; i < len; i++ ) {
   file = this.files[i];

   if (!!file.type.match(/image.*/)) {
    if ( window.FileReader ) {
     reader = new FileReader();
     reader (e) {
      showUploadedItem(e.target.result, file.fileName);
     };
     reader.readAsDataURL(file);
    }
    if (formdata) {
     formdata.append("images[]", file);
    }
   }
  }

  if (formdata) {
   $.ajax({
    url: base_url() + 'index.php/create_project/ajax_up',
    type: "POST",
    data: formdata,
    processData: false,
    contentType: false,
    success: function (res) {
     document.getElementById("response")[removed] = res;
    }
   });
  }
}, false);
}());

AND MY CONTROLLER :

Code:
function ajax_up() {
  foreach ($_FILES["images"]["error"] as $key => $error) {
      if ($error == UPLOAD_ERR_OK) {
          $name = $_FILES["images"]["name"][$key];
          move_uploaded_file( $_FILES["images"]["tmp_name"][$key], "uploads/" . $_FILES['images']['name'][$key]);
      }
  }


  echo "<h2>Successfully Uploaded Images</h2>";

}

Well, the image seems to be interpreted by Ajax but doesn't appear in my Upload folder, any ideas everyone ? Many thanks !!!


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2021 MyBB Group.