Making use of JSON returned from serverside to clientside-Collection of common programming errors

UPDATE 3:

The following does not seem to make any difference, does exactly the same thing as the script in update 2:

var $obj = jQuery.parseJSON(results);

$.each($obj, function(key, value) { 
    alert(key + " - " + value);
});

UPDATE 2:

$.each(jQuery.parseJSON(results), function(key, value) { 
    alert(key + " - " + value);
});

The script above is now returning the currect number of alerts, but not the correct data. it gives me this:

0 - [object, Object]
1 - [object, Object]
2 - [object, Object]

UPDATE 1:

The get_json.aspx is currently returning this:

[{"key":1,"value":"Default"},{"key":2,"value":"Reports"},{"key":3,"value":"Other"}]

The current script now looks like this:

$.ajax({
    url: 'get_json.aspx',
    type: 'GET',
    error: function(xhr, status, error) {
        alert('Error: ' + status + '\nError Text: ' + error + '\nResponse Text: ' + xhr.responseText);
    },
    success: function(results) {
        $.each(results, function(key, value) { 
            alert(key + " - " + value);
        });
    }
});

But when I go to this webpage, it just gives me a never ending supply of javascript alerts, i.e.

    0 - undefined
    1 - undefined
    2 - undefined
    3 - undefined
...
    75 - undefined
    76 - undefined
    77 - undefined
    78 - undefined

ORIGINAL QUESTION:

If I return key:value paired JSON from the server. How do I make use of that JSON?

I am trying to use the JSON in the success part of the ajax/jquery below:

$.ajax({
    url: 'get_json.aspx',
    type: 'GET',
    error: function(xhr, status, error) {
        alert('Error: ' + status + '\nError Text: ' + error + '\nResponse Text: ' + xhr.responseText);
    },
    success: function(results) {
    /*
    using the key:value pair json return, if 3 pairs are return, somehow generate the following
    where key = the value of the querystring in the url, i.e. tab = 1,2,3
    and value = Default, Reports, Other
        $("#tabs").tabs("add","tabs.aspx?tab=1","Default")
        $("#tabs").tabs("add","tabs.aspx?tab=2","Reports")
        $("#tabs").tabs("add","tabs.aspx?tab=3","Other")
    */
    }
});

1. Take a look at http://www.json.org/js.html

2. You would probably want something like this:

   $.each(results, function(key, value) { $(“#tabs”).tabs(“add”,”tabs.aspx?tab=” + key,value) });

   $.each(results, function(i) { 
       $("#tabs").tabs("add","tabs.aspx?tab=" + results[i].key, results[i].value)
   });
   

   If the content type of the response is “text/json” then you don’t need to use parseJson() because JQuery will do that for you.

3. When you return properly formed json (You can verify that it is properly formed here Json Parser Online). You can use the eval() function supplied by javascript. Ie.

   var myJSONObject = {"bindings": [
           {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"},
           {"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"},
           {"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"}
       ]
   };
   

   To use a returned text string… do this:

   var myObject = eval('(' + myJSONtext + ')');
   

   If you insist on using the jquery parsing options, use:

   var obj = jQuery.parseJSON( myJsontext ); 
   

   This info is available at JSON in JavaScript

Originally posted 2013-11-10 00:09:08.