CODEWITHSUNDEEP
jqueryjson
almighty
almighty

Reputation: 167

parsing json dictionary in javascript to iterate through keys

I have the below json data coming from web service which is nothing but a dictionary serialized into json, now on client side i need to parse this back to iterate through the keys of this json dictionary using javascript or jquery

{
   "AboutToExpire": {
      "Display": true,
      "Message": "Several of your subscriptions are about to expire. <a id=\"lnkShowExpiringSubs\" href=\"#\">View subscriptions<\/a>"
   },
   "Expired": {
      "Display": true,
      "Message": "Your McAfee WaveSecure - Tablet Edition subscription has expired and you’ve been without protection for 384 days. <a id=\"lnkNotificationRenewNow\" href=\"http://home.mcafee.com/root/campaign.aspx?cid=96035&pk=FAB37CF4-3680-4A87-A253-77E7D48BF6D7&affid=0\">Renew now<\/a>"
   }
}

Upvotes: 13

Views: 60052

Answers (4)

Louie
Louie

Reputation: 149

  • the flask web server example below uses jsonify(dict)
  • javascript can iterated over the returned json dict without any additional conversions
  • this is a working example from 2020 (the original op/replies are from 2012)

'

-- DICTIONARY -- playlist dict
{'37wuvQZF06evO3kppDB': {'Display Name': 'Spotify',
                         'Duration': '0',
                         'Playlist Id': '37iloxevO3kppDB',
                         'Playlist Name': 'This Is Olan Mill',
                         'Public': 'Private',
                         'Tracks': '50',
                          'User Id': 'spotify'},
 '3VgKlrplm4BATKwHdDi': {'Display Name': 'Spotify',
                         'Duration': '0',
                         'Playlist Id': '3VgKlm4BATKwHdDi',
                         'Playlist Name': 'The Magic Of The Oboe',
                         'Public': 'Private',
                         'Tracks': '16',
                         'User Id': 'spotify'}}


-- Python Flask JSONIFY -- return the playlist dict
@app.route("/Playlists", methods=['get', 'post'])
def Playlist():
  cookieDump('Playlists')
  if request.method == 'POST':
    if request.form.get('getPlDict') == 'getPlDict':
      print('/Playlists getPlDict')
      return jsonify(session['mPlDict'])

  retVal = oLoader.loadPlDict()
  return render_template("plTable.html")


-- JAVASCRIPT -- load playlist into a html table
$.post(vUrl, { getPlDict: "getPlDict"}, function(plDict, status)
{
  $.each(plDict, function(key, val)
  {
      var rowNode = vPlTable.row.add(['', val['Playlist Name'], val['Tracks'], val['User Id'],
                                          val['Display Name'], val['Public'], val['Playlist Id']]);
  })
  vPlTable.draw();
});

'

Upvotes: 0

craftsman
craftsman

Reputation: 15653

var s = '{"AboutToExpire":{"Display":true,"Message":"Several of your subscriptions are about to expire. \u003ca id=\"lnkShowExpiringSubs\" href=\"#\"\u003eView subscriptions\u003c/a\u003e"},"Expired":{"Display":true,"Message":"Your McAfee WaveSecure - Tablet Edition subscription has expired and you’ve been without protection for 384 days. \u003ca id=\"lnkNotificationRenewNow\" href=\"http://home.mcafee.com/root/campaign.aspx?cid=96035&pk=FAB37CF4-3680-4A87-A253-77E7D48BF6D7&affid=0\"\u003eRenew now\u003c/a\u003e"}}';

var data = eval(s); // this will convert your json string to a javascript object

for (var key in data) {
    if (data.hasOwnProperty(key)) { // this will check if key is owned by data object and not by any of it's ancestors
        alert(key+': '+data[key]); // this will show each key with it's value
    }
}

Upvotes: 9

Shiplu Mokaddim
Shiplu Mokaddim

Reputation: 57690

Use JSON2.js

var obj = JSON.parse(data);
for(var key in obj){
    if (obj.hasOwnProperty(key)){
        var value=obj[key];
        // work with key and value
    }
}

Upvotes: 30

chris
chris

Reputation: 36957

Parse it back to? You could just iterate over it as the object that it is.

Say you defined your JSON object as a variable through a closure or something, or for the sake of example just as a variable hardcoded... IE:

var myJSON = "{"AboutToExpire":{"Display":true,"Message":"Several of your subscriptions are about to expire. \u003ca id=\"lnkShowExpiringSubs\" href=\"#\"\u003eView subscriptions\u003c/a\u003e"},"Expired":{"Display":true,"Message":"Your McAfee WaveSecure - Tablet Edition subscription has expired and you’ve been without protection for 384 days. \u003ca id=\"lnkNotificationRenewNow\" href=\"http://home.mcafee.com/root/campaign.aspx?cid=96035&pk=FAB37CF4-3680-4A87-A253-77E7D48BF6D7&affid=0\"\u003eRenew now\u003c/a\u003e"}}"

with jquery's each() you can just iterate over it like.

$each(myJSON, function(x){document.print(myJSON.AboutToExpire[x].Message);`});

Upvotes: 1

Related Questions