Iterate over json array using jquery

There have been some post with my similar problem: How do I iterate over a JSON array using jQuery/AJAX call from PHP? but not quite the same.

I'm getting and error from jquery: a is null

It is because of the code I've added to loop through the json data:

$(function () 
{
$.ajax({                                      
  url: 'ajax_dashboard/api.php',    //the script to call to get data          
  data: "",                        
  dataType: 'json',                    
  success: function(data)          
  {
        $.each(data, function() {
          $.each(this, function(k, v) {
                $('#output').append("<b>key: </b>"+k+"<b> value: </b>"+v)
                    .append("<hr />");
          });
        }); 
  } 
});
}); 

And here is the php file (which I did verify gives valid JSON format):

$query_camera_name = "SELECT camera_name, camera_status, camera_quality, email_notice, camera_hash, camera_type FROM #__cameras WHERE user_id=".$user->id." AND camera_status!='DELETED'";
$db->setQuery($query_camera_name);
//get number of cameras so we can build the table accordingly
$db->query();
$num_rows = $db->getNumRows();
// We can use array names with loadAssocList.
$result_cameras = $db->loadAssocList();
echo json_encode($result_cameras);
?>

This returns this json formatted data:

[
    {
        "camera_name": "ffgg",
        "camera_status": "DISABLED",
        "camera_quality": "MEDIUM",
        "email_notice": "DISABLED",
        "camera_hash": "0d5a57cb75608202e64b834efd6a4667a71f6dee",
        "camera_type": "WEBCAM"
    },
    {
        "camera_name": "test",
        "camera_status": "ENABLED",
        "camera_quality": "HIGH",
        "email_notice": "ENABLED",
        "camera_hash": "6ab000ef7926b4a182f0f864a0d443fc19a29fdd",
        "camera_type": "WEBCAM"
    }
]

If I remove the loops the "a is null" error is gone. What am I doing wrong?

Answers


Your iteration code works just fine: http://jsfiddle.net/SuyMj/

The error is elsewhere.

Edit:

Try this to help debug.

success: function(data, textStatus, xhr) {
  console.log(xhr);
  ...
}

xhr will contain a lot of information about the request being made. What does the responseText contain? What is the statusText?


Need Your Help

Best way to protect POSTED data over http?

javascript google-chrome google-chrome-extension rsa public-key-encryption

I have a Chrome extension that I am working on that will POST data to a remote server. I wish to encrypt the data before it gets sent. My server doesn't have HTTPS so I have to send it over plain H...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.