CODEWITHSUNDEEP
phpjqueryajax
Albert.tomasiak
Albert.tomasiak

Reputation: 307

Ajax call returns error with status 200 and statustext OK

I'm working on a form where the user sends an image and a comment together with it. No matter what happens the ajax call goes straight to the error (even if the file and comment are succesfully uploaded and written to DB).

I tried logging the feedback on error, and this is what I recieve:

Object {readyState: 4, responseText: "<pre class='xdebug-var-dump' dir='ltr'>↵<b>array</…DstagramPost succesfully made.{"check":"success"}", status: 200, statusText: "OK"}

This is my ajax call:

<script type="text/javascript"> 
$(document).ready(function(){

    $("#postSubmit").on("click", function(e){
        $.ajax({
            url: "ajax/postUpload.php", 
            type: "POST",             
            data: new FormData($("#postForm")[0]),
            dataType: 'json',
            contentType: false,       
            cache: false,             
            processData:false,        
            success: function(data)  
            {
                console.log(data);
            },
            error: function (request, status, error) {
                console.log(request);
                alert('Something is wrong');
            }
        });
        e.preventDefault();
    });
});
</script>

And my PHP code:

<?php
include_once("../classes/Post.class.php");
session_start();
$post = new Post();

var_dump($_FILES);
if(!empty($_POST)){

$file_tmp_name = $_FILES['postImage']['tmp_name'];

$post->checkIfImage();
$post->checkFileSize();
$post->checkFileFormat();
$post->checkAspectRatio();

if(!$post->checkIfImage()){
    $uploadStatus['image'] = "false";
}

if(!$post->checkFileSize()){
    $uploadStatus['size'] = "false";
}

if(!$post->checkFileFormat()){
    $uploadStatus['format'] = "false";
}

if(!$post->checkAspectRatio()){
    $uploadStatus['ratio'] = "false";
}

if($post->checkIfImage() && $post->checkFileSize() && $post-    >checkFileFormat() && $post->checkAspectRatio()){
    $result = $post->createPost($file_tmp_name);
    $uploadStatus['check'] = "success";
}else{
    $uploadStatus['check'] = "error";
}

header('Content-Type: application/json; charset=utf-8', true);
echo json_encode($uploadStatus);
}

?>

So to sum it up, if the image passes all the requirements like checkIfImage(), ... it get's uploaded to a folder, and the image path and description get posted in the Database. If it doesn't pass all the requirements it doesn't get posted there. However I get an error everytime.

If I delete the dataType: 'json' part it goes to error, if I change it to anything else I get the following output:

<pre class='xdebug-var-dump' dir='ltr'>
<b>array</b> <i>(size=1)</i>
'postImage' <font color='#888a85'>=&gt;</font> 
<b>array</b> <i>(size=5)</i>
  'name' <font color='#888a85'>=&gt;</font> <small>string</small> <font        color='#cc0000'>'passfoto.png'</font> <i>(length=12)</i>
  'type' <font color='#888a85'>=&gt;</font> <small>string</small> <font color='#cc0000'>'image/png'</font> <i>(length=9)</i>
  'tmp_name' <font color='#888a85'>=&gt;</font> <small>string</small> <font color='#cc0000'>'D:\xampp\tmp\phpDFE9.tmp'</font> <i>(length=24)</i>
  'error' <font color='#888a85'>=&gt;</font> <small>int</small> <font color='#4e9a06'>0</font>
  'size' <font color='#888a85'>=&gt;</font> <small>int</small> <font color='#4e9a06'>112825</font>
</pre>D:\xampp\htdocs\IMDstagramPost succesfully made.{"check":"success"}

The part that I need is of course the check, so I can for example clear the form if check = success or give an error if it's not..

Upvotes: 1

Views: 1028

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337700

The problem is because you have some HTML you are outputting in your PHP file before you echo the JSON. You can see it in the JSON response parameter: 

<pre class='xdebug-var-dump' dir='ltr'>↵<b>array</…DstagramPost succesfully made.

Remove that HTML. The response text should be only this JSON formatted string:

{"check":"success"}

Upvotes: 3

Related Questions