Sign up ×
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other. Join them, it only takes a minute:

I'm trying to upload a form which includes an image using jquery and php - the data is saved, but the image is not uploaded, and the ajax call runs the error function, not the success function.

Even though there is text echoed out of the php file, in jQuery it just seems to be an object who's .text value is undefined...

These are the error messages in the php error log:

[28-Jan-2015 12:56:32 Europe/Berlin] PHP Warning: move_uploaded_file(uploads/mail.jpeg): failed to open stream: No such file or directory in /Applications/MAMP/htdocs/app/php/signuporganization.php on line 133 [28-Jan-2015 12:56:32 Europe/Berlin] PHP Warning: move_uploaded_file(): Unable to move '/Applications/MAMP/tmp/php/phpXQ1WoR' to 'uploads/mail.jpeg' in /Applications/MAMP/htdocs/app/php/signuporganization.php on line 133 [28-Jan-2015 14:35:29 Europe/Berlin] PHP Warning: move_uploaded_file(uploads/mail.jpeg): failed to open stream: No such file or directory in /Applications/MAMP/htdocs/app/php/signuporganization.php on line 133 [28-Jan-2015 14:35:29 Europe/Berlin] PHP Warning: move_uploaded_file(): Unable to move '/Applications/MAMP/tmp/php/phpXKRDO4' to 'uploads/mail.jpeg' in /Applications/MAMP/htdocs/app/php/signuporganization.php on line 133 [28-Jan-2015 14:37:28 Europe/Berlin] PHP Warning: move_uploaded_file(uploads/mail.jpeg): failed to open stream: No such file or directory in /Applications/MAMP/htdocs/app/php/signuporganization.php on line 133 [28-Jan-2015 14:37:28 Europe/Berlin] PHP Warning: move_uploaded_file(): Unable to move '/Applications/MAMP/tmp/php/phpuUFyx6' to 'uploads/mail.jpeg' in /Applications/MAMP/htdocs/app/php/signuporganization.php on line 133

I just can't work out what the problems are. Thanks in advance.

My jQuery code is:

$("#signUpOrganizationForm").submit(function(){
		//var organizationFormData = $(this).serialize();
		//data to be sent to server (serialize doesn't work for files, so instead we are manually created FormData. Alternatively you can use the Jquery Form Plugin.        
            var organizationFormData = new FormData();
	    organizationFormData.append( "profilepic", $('#profilepic')[0].files[0]);
	    organizationFormData.append( "orgName", $('#orgName').val());
            organizationFormData.append( "Username", $('#Username').val());
            organizationFormData.append( "Password", $('#Password').val());

	    
		//e.preventDefault();
		
		$.ajax({
			url: "php/signuporganization.php", //Relative or absolute path to response.php file
			type: "POST",
			data: organizationFormData,
			contentType: false,
			processData: false,
			dataType:'json',
			success: function(data) {
			//	data = JSON.parse(data);
				console.log(data);
				alert('Hello we are here and data return = ' + data);
				localStorage.id = data;
				console.log('localStorage = ' + localStorage.id);
				$.mobile.changePage($('#home-organization'),'pop');
				},
			error: function(data, status, error) {
				//data = JSON.parse(data)
				alert('error:' + data.text);	
			}
		});
	});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

And the php file is:

<?php

$profilepic = $_FILE[ 'profilepic' ];
$orgName = $_POST[ 'orgName' ];
$name = $_POST[ 'Username' ];
$password = $_POST[ 'Password' ];
$Description = $_POST[ 'Description' ];
$today = date("Ymd");

getPageData($orgName, $name, $password, $today, $Description);
uploadprofilepic($profilepic);

function connectToDB() {

    $mysqliLink = new mysqli('localhost', 'root', 'root', 'giving');

    if(mysqli_connect_errno()){
        echo('not connected');
        exit();
    } else {
    }
    
    return $mysqliLink;
}

function getPageData($orgName, $name, $password, $today, $Description) {
        $mysqliLink = connectToDB();
        $Id = '';
        $query1 = "INSERT INTO users (username,password,type) VALUES ('$name','$password', 'organization')";
        $query2 = "SELECT id FROM users WHERE username='$name'";
        $query3 = "INSERT INTO Organization (Id,Name,SignUpDate,Description,LastActive) VALUES ('$Id', '$orgName', '$today', '$Description','$today')";
        
        if ($result = $mysqliLink->query($query1)) {
                if ($result2 = $mysqliLink->query($query2)) {
                    
            /* fetch object array */
                     while ($obj = $result2->fetch_object()) {
                        $Id=$obj->id;                
                        //$Id =intval($Id);
                      }
                     if ($result3 = $mysqliLink->query($query3)) {
                           echo($Id);
        
        /* free result set */
        //$result->close();
        //$result2->close();
        //$result3->close();
                    }
                }
        }
        /* close connection */
        $mysqliLink->close();

        //$result = $mysqliLink->query("SELECT * FROM 'users' WHERE username='talsegel'");
        //while ($obj = $result->fetch_object()) {
       // echo($obj->password);
        //}
       // alert($DBpassword);


       //  echo('hi' + $obj->password);
    }
    
function uploadprofilepic($profilepic){
    $target_dir = "uploads/";
    $target_file = $target_dir . basename($_FILES["profilepic"]["name"]);
    echo($target_file);
    $uploadOk = 1;
    $imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);

    // Check if image file is a actual image or fake image
    if(isset($_POST["submit"])) {
      $check = getimagesize($_FILES["profilepic"]["tmp_name"]);
      if($check !== false) {
        echo ("File is an image - " . $check["mime"] . ".");
        $uploadOk = 1;
      } else {
          echo ("File is not an image.");
          $uploadOk = 0;
      }
    }
    // Check if file already exists
    if (file_exists($target_file)) {
      echo ("Sorry, file already exists.");
      $uploadOk = 0;
    }

    // Check file size
    if ($_FILES["profilepic"]["size"] > 500000) {
      echo ("Sorry, your file is too large.");
      $uploadOk = 0;
    }
    // Allow certain file formats
    if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
      echo ("Sorry, only JPG, JPEG, PNG & GIF files are allowed.");
      $uploadOk = 0;
    }

    // Check if $uploadOk is set to 0 by an error
    if ($uploadOk == 0) {
      echo ("Sorry, your file was not uploaded.");
    // if everything is ok, try to upload file
    } else {
    if (move_uploaded_file($_FILES["profilepic"]["tmp_name"], $target_file)) {
          echo ("The file ". basename( $_FILES["profilepic"]["name"]). " has been uploaded.");
    } else {
        echo ("Sorry, there was an error uploading your file.");
    }
  }
 }


?>

share|improve this question
    
Just do alert('error:' + data); rather than alert('error:' + data.text); – developerwjk Jan 27 at 22:16
    
Tried that.... just gives me "error:[object Object]" – TS1 Jan 28 at 1:35
    
Do alert('error:' + JSON.stringify(data)) – Max Jan 28 at 13:07
    
Thanks Max. That worked. It's giving me this: error:{"readyState":0,"responseText":"","status":0,"statusText":"error"} – TS1 Jan 28 at 13:38

2 Answers 2

I think it should be $_FILES not $_File in your php script on the first line where you are getting the profilepic.

share|improve this answer

I found out this was a problem in Cross Origin Resource Sharing (CORS). I solved it by putting header('Access-Control-Allow-Origin: *'); in the php file. Apparently that's not a good option for production, but this is just testing. In addition, the filepath was relative, so I had to make the uploads folder in the php folder, and lastly, I had to encode the data being returned as a JSON object.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.