Using jQuery AJAX to pass JSON Object to PHP file

Question

I have a JSON object like this (assigned to var card;):

{
    card_no: "1", 
    card_name: "wwwgdefonru",  
    img_id: 1, 
    img_thumb: "albums/070915_E239/thumbs/001_wwwgdefonru.jpg", 
    img_hires: "albums/070915_E239/thumbs_hires/001_wwwgdefonru.jpg"
}

I want to pass this using AJAX to a php support file.

Here's my AJAX call:

jQuery.ajax({
    method: 'POST',
    url: ajax_file,
    type: 'JSON',
    data:  card,
    dataType: 'html',
    cache: false,
    success: function(html){
        console.log('SUCCESSO');
        jQuery('#debug').html(html);    
    },
    complete:function(){
        console.log('COMPLETE');
    }
});

In my PHP file (just for debugging purposes) I output the passed data like so:

echo '<pre>';
    print_r($_POST);
echo '</pre>';

The AJAX call completes successfully. But the output is blank:

Array
(
)

Where am I going wrong with this?

SOLUTION

I am working on a project with an old version of jQuery (don't ask...). From looking at the docs (http://api.jquery.com/jquery.ajax/) I could see that setting the method using method: 'POST' wasn't working because it isn't supported by the version of JQ I am using. Switching it to type: 'POST' and getting rid of type: 'JSON' fixed it.

I wouldn't have spotted this had I not looked at the network tab and seen the request Method was GET even though I have defined it as POST.

@Rasclatt tried that with mccannfs suggestion and without. Same result. — user3065931, Sep 07 '15 at 13:57
`type` is an alias for `method`. Use one or the other and don't give it the value `"JSON"`. — Quentin, Sep 07 '15 at 14:11
**Don't** use `contentType: 'application/json',`. You aren't sending JSON. — Quentin, Sep 07 '15 at 14:11
Look at the Net tab in your developer tools. Look for the Ajax request. Does it have the data in it you expect? Is it going to the right URL? — Quentin, Sep 07 '15 at 14:12
@Quentin - good suggestion, I should've thought of that. This helped me fix the issue. I'll update my answer with the solution. — user3065931, Sep 07 '15 at 14:19

score -1 · Answer 1 · answered Sep 07 '15 at 13:55

The method of writing post method is in this way is so easy for you

$.post("your_php_file_url.php",
    {
        card_no: "1", 
        card_name: "wwwgdefonru",  
        img_id: 1, 
        img_thumb: "albums/070915_E239/thumbs/001_wwwgdefonru.jpg", 
        img_hires: "albums/070915_E239/thumbs_hires/001_wwwgdefonru.jpg"
    },
    function(data, status){
        alert("Response Message" + data + "\nResponse Status: " + status);
    });

In your PHP site you read the values using

<?php
     echo $_POST['card_no'];
?>

like this you could get other values and do your works!

While starting again from scratch *might* solve the problem, its hard to be sure unless you can identify the actual problem with the existing code. — Quentin, Sep 07 '15 at 14:14

Using jQuery AJAX to pass JSON Object to PHP file

1 Answers1

Linked