Displaying Dictionary in Javascript Object

Question

I'm returning this response from my server:

callback({"City": "Miami", "State": "FL", "Street": "9th Street", "Name": "Big 12", "Zip": "65201", "Lat": -48.219999999999999, "Telephone": "5732168906", "Long": 32.0, "Events": "[{\"End Time\": \"2011-01-22 23:36:31\", \"Name\": \"Margaritas\", \"Start Time\": \"2011-01-22 15:36:31\"}, {\"End Time\": \"2011-01-22 19:36:39\", \"Name\": \"Dollar Bottles\", \"Start Time\": \"2011-01-22 15:36:39\"}, {\"End Time\": \"2011-01-23 23:36:31\", \"Name\": \"All You Can Drink\", \"Start Time\": \"2011-01-23 15:36:31\"}]"})

Here is where I'm attempting to parse the response and display it within my "tonight-list". With data.Events, I get the entire array of dictionaries displayed on screen.

function callback(data){
    console.log(data);
    $("#tonight-list").append("<li role='option' tabindex='0' class='ui-li ui-li-static ui-btn-up-c'>Starts:" + 
    data.Events  + 
    "<li>");

However, I cannot figure out how to access each element (Start Time, End Time, Name, etc.). When I try data.Events[0], it gives me just the first character from data.Events.

How do I access each dictionary key in the array of Events? I just cannot figure out the syntax - it would be nice if I could see all the options on this object type. Thanks for the help in advance!

gblazex · Accepted Answer · 2011-01-15 23:05:46Z

1

Make the Events in the JSON response a real array instead of a string, then you can use it like this:

var obj = JSON.parse(reponseText);
var event = obj.Events[0];
alert(event["End Time"]); // hurray

JSON response

callback({
  "City": "Miami",
  "State": "FL",
  "Street": "9th Street",
  "Name": "Big 12",
  "Zip": "65201",
  "Lat": -48.219999999999999,
  "Telephone": "5732168906",
  "Long": 32.0,
  "Events": [{
    "End Time": "2011-01-22 23:36:31",
    "Name": "Margaritas",
    "Start Time": "2011-01-22 15:36:31"
  },
  {
    "End Time": "2011-01-22 19:36:39",
    "Name": "Dollar Bottles",
    "Start Time": "2011-01-22 15:36:39"
  },
  {
    "End Time": "2011-01-23 23:36:31",
    "Name": "All You Can Drink",
    "Start Time": "2011-01-23 15:36:31"
  }]
});

edited Jan 15, 2011 at 23:05

answered Jan 15, 2011 at 23:00

gblazex

50.3k12 gold badges100 silver badges92 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user546459 Over a year ago

Thanks galambalazs! Changing the first line to var obj = JSON.parse(data.Events); made everything work as needed:)

stevebot · Accepted Answer · 2011-01-15 22:57:52Z

1

JSON dude! just return valid JSON from your server and use evalJSON. Then you can access each object via their corresponding keys.

edit:

basically do,

data.responseText.evalJSON();

answered Jan 15, 2011 at 22:57

stevebot

24.2k35 gold badges133 silver badges187 bronze badges

2 Comments

user546459 Over a year ago

I knew I needed something along those lines! Whenever I call data.evalJSON(); it states that object has no evalJSON method. Do I need to be returning something different from my server? content_type='application/javascript; charset=utf-8' is what I'm currently returning.

stevebot Over a year ago

application/json or you can return a text response. Either way you need to get the responseText off of the response object.

Collectives™ on Stack Overflow

Displaying Dictionary in Javascript Object

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related