How to access entry in the javascript object array

Question

I assigned a JSON result from php to a javascript variable. The result returned looks like below but it gives me undefined undefined

[{"a":"2","u":"jamesoduro","l":"Oduro","f":"James"},{"a":"5","u":"deary.grace","l":"Grace","f":"Dear"}]

I simple know this look like a javascript array with two objects. I am trying to access the data inside the objects but to no avail. Below is script:

PHP

    <?php   

//fetch  online users
$array  = array();
$sql    = "SELECT id as a,username as u, lastname as l,firstname as f FROM users WHERE active =1 limit 2";
$q      = mysqli_query($dbc_conn,$sql);

while($row  = mysqli_fetch_assoc($q)){
    $array[]    = $row; 

}

$json = json_encode($array);    
echo $json;


?>

JQUERY

$(document).ready(function(){

    //checking online users
    setTimeout(function(){
    $.ajax({
        url:"testing.php",
        type:"post",
        success:function(response){

            var array = response;
            console.log(array[0].f +" "+ array[0].l);
        }
    });
},200);

});

Please what could be the problem?? Thank you

Given what you've shown your code should work: jsfiddle.net/uwtr3q7j. Try contentType: "application/json" in the AJAX request to force jQuery to deserialise the JSON for you (although it should do this itself if the response has the correct MIME type set) and check that response is an object with console.log(typeof response) — Rory McCrossan
– Rory McCrossan, Commented Sep 8, 2016 at 13:22
yes ..that is when you copy the result and try accessing data — lernyoung
– lernyoung, Commented Sep 8, 2016 at 13:32

passion · Accepted Answer · 2016-09-08 13:22:56Z

2

 $.ajax({
    url:"testing.php",
    type:"post",
    success:function(response){

        var array = JSON.parse(response);
        console.log(array[0].f +" "+ array[0].l);
    }
});

You get a string from php , need turn the string into a json object .

You have to learn to debug your code to find what is going wrong I guess .

answered Sep 8, 2016 at 13:22

passion

1,3609 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

kapantzak · Accepted Answer · 2016-09-08 13:31:47Z

1

Try deserializing the response:

var array = JSON.parse(response);

EXPLANATION

The response you get from the ajax call is of type string, so you have to convert it to an object. That's what JSON.parse() method do: it parses the JSON string and creates the object that this string represent, following specific rules (The parsed string must be in a valid JSON format).

edited Sep 8, 2016 at 13:31

answered Sep 8, 2016 at 13:22

kapantzak

11.8k5 gold badges42 silver badges63 bronze badges

1 Comment

lernyoung Over a year ago

thanks..this works ...can you please tell me what the JSON.parese() do and why u used it??

Amar Singh · Accepted Answer · 2016-09-08 13:31:19Z

1

Keep your server side PHP script code neat and clean

Start PHP block from first character of first line.
Do not close php block if there is no output in HTML format.
Use ob_clean() function before echo output in is your are in developer mode and display error is enabled.

for example

ob_clean();
echo json_encode($array);

In client side, if you are getting JSON response in ajax, pass dataType:'json' in ajax option

$.ajax({
    url:"testing.php",
    type:"post",
    dataType:"json",
    success:function(response){
        console.log(response[0].f +" "+ response[0].l);
    }
});

edited Sep 8, 2016 at 13:31

Amar Singh

5,6223 gold badges30 silver badges56 bronze badges

answered Sep 8, 2016 at 13:27

Haresh Vidja

8,4713 gold badges29 silver badges44 bronze badges

Collectives™ on Stack Overflow

How to access entry in the javascript object array

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related