CODEWITHSUNDEEP
phpjquerymysqlajax
al1en
al1en

Reputation: 511

how to access returned data in ajax from php?

OK I might have some syntax problem that I cant locate but I think something else is the problem.

I have a .php file that selects multiple values from a database and than that result is 'echo' back to the ajax call where it comes from.

The .php looks like this:

<?php
    require("../config/db.php");

    $db = mysql_connect(DB_HOST, DB_USER, DB_PASS)or die("Error connecting to database.");
    mysql_query("SET NAMES UTF8");
    mysql_select_db(DB_NAME, $db)or die("Couldn't select the database."); 

    $query = "SELECT online_users, chat_messages, cards_order FROM track_changes LIMIT 1";
    $result = mysql_query($query, $db) or die(mysql_error().': '.$query);
    $row = mysql_fetch_array($result);

    $changes = array('online_users'=>$row['online_users'],
                'chat_messages'=>$row['chat_messages'],
                'cards_order'=>$row['cards_order']);

    echo json_encode($changes, JSON_FORCE_OBJECT);
?>

than the jQuery ajax call looks like this:

$(document).ready(function() {
$.ajax({ 
    type: 'POST',
    url: '/kanbannew/php_scripts/track_changes.php',
    data: { },
    async: false,
    success: function (data) {      
        console.log(data);
        var users = data.online_users;
        var chat = data.chat_messages;
        var cards = data.cards_order;
        console.log("Online users: " + users + "\nChat messages: " + chat + "\nCards order: " + cards);
    },
    error: function(xhr, desc, err) {
        console.log(xhr);
        console.log("Details: " + desc + "\nError:" + err);
    }
}); // ajax end
});

The problem is in the first alert i get the key:values like

{"online_users":"0","chat_messages":"0","cards_order":"0"}

but in the second alert i get undefined for every value:

Online users: undefined
Chat messages: undefined
Cards order: undefined

This prints are from chrome conzole. Any ideas why I cant access the zero's??

Upvotes: 2

Views: 784

Answers (2)

melvin
melvin

Reputation: 1125

You can add 

header('Content-type: application/json');

to your php code (before you echo anything) to achieve the same result what can be helpful if you expect your code to be consumed by third parties. But i would definitly add the dataType as well as suggested by alexey

Upvotes: 2

Alexey Palamar
Alexey Palamar

Reputation: 1430

Add dataType.

$(document).ready(function() {
$.ajax({ 
    type: 'POST',
    url: '/kanbannew/php_scripts/track_changes.php',
    data: { },
    dataType: 'json',
    async: false,
    success: function (data) {      
        console.log(data);
        var users = data.online_users;
        var chat = data.chat_messages;
        var cards = data.cards_order;
        console.log("Online users: " + users + "\nChat messages: " + chat + "\nCards order: " + cards);
    },
    error: function(xhr, desc, err) {
        console.log(xhr);
        console.log("Details: " + desc + "\nError:" + err);
    }
}); // ajax end
});

Upvotes: 2

Related Questions