Question

I need to parse a simple json response (from my rails app):

[
    {
        "photo":
            {
                "updated_at":"2010-10-14T19:12:35Z",
                "photo_file_size":206422,
                "created_at":"2010-10-14T19:12:01Z"
            }
      },
      {
        "photo":
            {
                "updated_at":"2010-10-16T18:19:38Z",
                "photo_file_size":83593,
                "created_at":"2010-10-14T19:14:35Z"
            }
       }
]

i am using:

$(document).ready(function()
{
    $.ajax({
     type: "GET",
     url: "http://myurl...",    
     dataType: "jsonp",
     success: function(data){
        console.log(data);          
        //...
          });

     }
    });
});

firebug console output indicate that the response is ok!

How can i parse each photo_file_size from all photo blocks using function(data)?

any help will be highly appreciated 🙂

Answer 1

jQuery will automatically parse the data as JSON, because you set the data type. In the success method you can use basic Javascript to do something with photo_file_size

$(document).ready(function(){
  $.ajax({
    type: "GET",
    url: "http://myurl...",    
    dataType: "json",
    success: function(data){
      for( var i=0; i<data.length; i++ ){
        alert( data[i].photo.photo_file_size );
      }
    }
  });
});

---

However, if you’re using JSONP, you need to approach it completely different. JSONP has a callback function, and will be served in a <script> tag (to avoid the same origin policy, see Wiki)

<script>
    function callback( data ){
      for( var i=0; i<data.length; i++ ){
        alert( data[i].photo.photo_file_size );
      }
    }
</script>
<script src="yoururltojsonp.php?callback=callback"></script>

Also, take a look at jQuery’s solution