JSON call returns [object Object] or undefined

Question

Very beginner level question. Trying to learn JSON and having trouble with getting proper return data. I'm trying to use JSON to return errors from a php form using json_encode($errs, JSON_FORCE_OBJECT) , but first I want to make the very simple code below work to understand JSON Objects.

I've viewed similar threads here, read the entire JSON.org documentation, looked at JQuery's $.getJSON() method and plugged in the exact code from the documentation, as well as the exact code for the JSON documentation, and I still can't seem to get a response other than "undefined" or "[object, Object]".

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <!---CSS-->
    <link href="style/960.css" media="all" rel="stylesheet" type="text/css" />
    <link href="style/pubstyle.css" media="all" rel="stylesheet" type="text/css" />
    <!--- Javascript -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" 
    type="text/javascript"></script>
    <script src="javascripts/form.js" type="text/javascript"></script>
    <script src="javascripts/validate.min.js" type="text/javascript"></script>
    <script src="javascripts/json2.js" type="text/javascript"></script>
    </head>
    <body>
    <script type="text/javascript">
         $(document).ready(function() {
             var resp = {"message":"hi"};
         $("a#button").click(function(resp) {
           alert(resp)
         });
         });

    </script>

    <a id="button" href="#">Button</a>
    </body>
    </html>

The code above returns an alert with "[object Object]". When I change the code to:

    $(document).ready(function() {
             var resp = {"message":"hi"};
         $("a#button").click(function(resp) {
           alert(resp.message)
         });
         });

I get an "undefined" alert. I tried putting it into an array object

{ "messages": [ {"message":"hi"}]}

and calling it with

resp.messages[0].message

with no luck. I tried change the Content-Type to "application/json" and "text/plain" and neither worked. Also tried

$(document).ready(function() {  
var resp = jQuery.parseJSON('{"message":"hi"}');
$("a#button").click(function(resp) {
alert(resp.message)
});
});

Answer 1

You're confusing a couple different elements here.

Simple example, based on the last code chunk in your question:

$(document).ready(function() {  
    var resp = $.parseJSON('{"message":"hi"}');
    $('#button').click(function(event) {
        alert(resp.message);
    });
});

Your version of this code didn't work because the click callback function receives the click event object as its argument. The resp argument name in the callback shadowed the resp variable.

JSON call returns [object Object] or undefined

Question

1 answers

solution1
4 ACCPTED 2011-08-14 18:41:02

JSON call returns [object Object] or undefined

Question

1 answers

solution1 4 ACCPTED 2011-08-14 18:41:02

solution1
4 ACCPTED 2011-08-14 18:41:02