CODEWITHSUNDEEP
javascriptphpjson
Jan Guardian
Jan Guardian

Reputation: 313

How do I retrieve objects from JSON received from a php file?

I have a places.php file on my server that returns the following json:

{"places":[{"poi_id":"1","poi_latitude":"53.9606","poi_longitude":"27.6103","poi_title":"Shop1","poi_category":"Shopping","poi_subcategory":"Grocery Store","poi_address":"Street 1, 1","poi_phone":null,"poi_website":null},{"poi_id":"2","poi_latitude":"53.9644","poi_longitude":"27.6228","poi_title":"Shop2","poi_category":"Shopping","poi_subcategory":"Grocery Store","poi_address":"Street 2","poi_phone":null,"poi_website":null}]}

In my javascript I use the following piece of code:

$(document).ready(function() {
   var url="places.php";
   $.getJSON(url,function(data){
       $.each(data.places, function(i,place){
          var new1 = place.poi_id;
          alert(new1);
       });
   });              
});

However the message box with the poi_id doesn't pop up. What am I doing wrong?

Upvotes: 0

Views: 44

Answers (4)

Latheesan
Latheesan

Reputation: 24116

How about like this.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">

// data source
var jsonStr = '{"places":[{"poi_id":"1","poi_latitude":"53.9606","poi_longitude":"27.6103","poi_title":"Shop1","poi_category":"Shopping","poi_subcategory":"Grocery Store","poi_address":"Street 1, 1","poi_phone":null,"poi_website":null},{"poi_id":"2","poi_latitude":"53.9644","poi_longitude":"27.6228","poi_title":"Shop2","poi_category":"Shopping","poi_subcategory":"Grocery Store","poi_address":"Street 2","poi_phone":null,"poi_website":null}]}';

// parse json string to object
var jsonObj = JSON.parse(jsonStr);

// usage 1
console.log('iterate - without jQuery');
for (var i = 0; i < jsonObj.places.length; i++)
{
    var place = jsonObj.places[i];
    console.log(place.poi_id);
}

// usage 2
console.log('iterate - with jQuery');
$(jsonObj.places).each(function(index, place)
{
    console.log(place.poi_id);
});

</script>

Output:

enter image description here

How to use this in your code:

$(document).ready(function()
{
    $.getJSON("/path/to/places.php", function(data)
    {
        // data here will be already decoded into json object, 
        // so... you do this
        $(data.places).each(function(index, place)
        {
            console.log(place.poi_id);
        });
    });             
});

Take a look at the manual also: http://api.jquery.com/jquery.getjson/

Should work, if not leave a comment with an error or reason.

Upvotes: 1

Jan Guardian
Jan Guardian

Reputation: 313

Setting places.php file encoding to UTF-8 solved the problem

Upvotes: 0

nepeo
nepeo

Reputation: 509

Is your php actually generating the JSON? If it's only getting a particular file it may be easier to choose your file using JS and AJAX it. Here's the code I use for php anyway.

function callPHP(dataToSend)
{
    $.post( "places.php", dataToSend )
        .done(function( phpReturn ) {
            console.log( phpReturn );
            var data = JSON.parse(phpReturn);
            for(var i = 0;i<data.places.length;i++)
                console.log(data.places[i].poi_id);
    });}
}

Upvotes: 0

Swiffy
Swiffy

Reputation: 4683

Does this do / get you closer:

for (var property in data) 
{
    if (data.hasOwnProperty(property)) 
    {
        console.log(property);
    }
}

Upvotes: 0

Related Questions