Login | Register | FAQ
Anonymous

PHP and jQuery with AJAX upload not working

+ Post a reply

2 posts Page 1 of 1


PHP and jQuery with AJAX upload not working

by Jono » Sat Jul 04, 2015 11:24 am

Hello everyone, I have a js page that uses AJAX to take an image supplied in a <input type="file" />, send it through to a php page (upload.php) through POST. The jQuery runs as expected, the code for when it's successful runs, I know because I get the alert("Success");. Therefore I believe the problems lies in my PHP page. The files are displayed below. Thanks in advance.

HTML:
Code: Select all
<form id='uploadimage' method='post' enctype='multipart/form-data'>
<div id='selectImage'>
<input type='file' name='file' id='file' required />
<input type='button' id='imageUpload' value='Upload' class='submit' />
</div>
</form>


jQuery:
Code: Select all
$(document).ready(function (e) {
   $("#imageUpload").on('click',(function(e) {
      e.preventDefault();
      $('#loading').show();
      $.ajax({
         url: "upload.php", // Url to which the request is send
         type: "POST",             // Type of request to be send, called as method
         contentType: false,       // The content type used when sending data to the server.
         cache: false,             // To unable request pages to be cached
         processData:false,        // To send DOMDocument or non processed data file it is set to false
         success: function() {  // A function to be called if request succeeds
            alert("success");
            $('#loading').hide();
         }
      });
   }));
});


PHP Code:
Code: Select all
<?php
   if(isset($_FILES["file"]["type"])) {
      $validextensions = array("jpeg", "jpg", "png");
      $temporary = explode(".", $_FILES["file"]["name"]);
      $file_extension = end($temporary);
      if ((($_FILES["file"]["type"] == "image/png") || ($_FILES["file"]["type"] == "image/jpg") || ($_FILES["file"]["type"] == "image/jpeg")
      ) && ($_FILES["file"]["size"] < 100000000)//Approx. 100kb files can be uploaded.
      && in_array($file_extension, $validextensions)) {
         if ($_FILES["file"]["error"] > 0) {
            echo "Return Code: " . $_FILES["file"]["error"] . "<br/><br/>";
         } else {
            if (file_exists("upload/" . $_FILES["file"]["name"])) {
               echo $_FILES["file"]["name"] . " <span id='invalid'><b>already exists.</b></span> ";
            } else {
               $sourcePath = $_FILES['file']['tmp_name']; // Storing source path of the file in a variable
               $targetPath = "upload/".$_FILES['file']['name']; // Target path where file is to be stored
               move_uploaded_file($sourcePath,$targetPath) ; // Moving Uploaded file
               echo "<span id='success'>Image Uploaded Successfully...!!</span><br/>";
               echo "<br/><b>File Name:</b> " . $_FILES["file"]["name"] . "<br>";
               echo "<b>Type:</b> " . $_FILES["file"]["type"] . "<br>";
               echo "<b>Size:</b> " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
               echo "<b>Temp file:</b> " . $_FILES["file"]["tmp_name"] . "<br>";
            }
         }
      }
      else {
         echo "<span id='invalid'>***Invalid file Size or Type***<span>";
      }
   }
?>
User avatar

Jono

  • Posts: 45
  • Joined: Wed Oct 24, 2012 1:10 pm

Re: PHP and jQuery with AJAX upload not working

by emily008 » Wed Oct 07, 2015 6:35 am

I have used Uploadify Jquery plugin and customized it accordingly.
User avatar

emily008

  • Posts: 8
  • Joined: Wed Oct 07, 2015 6:29 am
  • Location: London
--
For more visit HTML Tutorial


+ Post a reply

Page 1 of 1