How to parse JSON array in jQuery

Question

EDIT I checked the jQuery documentation and using   ajax with the json datatype specified returns an evaluated javascript object  so eval   isn t the answer here   I knew that anyway  since I am able to parse single JSON objects  just not arrays   The problem is the   each-ing my way through them     I have followed the syntax for parsing a JSON array in jQuery to the letter  but it doesn t work for some reason   I am fetching the array using   ajax  have specified the correct datatype  and in Firebug can see that the response from my PHP script is      Yet when I try to use   each to iterate through the array  all I get is undefined values when I try to console log various parts of the array   Here is where my php script makes and encodes the array   if mysqli num rows  new res   gt  0     messages   array     while  message data   mysqli fetch assoc  query res        message   array       poster    gt   message data  poster         message    gt   message data  message         time    gt   message data  time            messages      message     echo json encode  messages     else if mysqli num rows  new res     0     message   array     poster    gt         message    gt   No messages       time    gt  1     echo json encode  message       And here is my attempt to parse it      var logged in     lt  php echo  logged in    gt       var poster     lt  php echo   SESSION  poster     gt           ajax        url   do chat php5        type   post        data     poster  poster  logged in  logged in         dataType   json        success  function data               each data  function messageIndex  message                        console log parseInt     chatWindow  last-child  gt  span   html        message  time            if  parseInt message  time     gt  parseInt     chatWindow  last-child  gt  span   html                 chatWindow   append   lt div class  poster  gt   message  poster     lt  div gt  lt div class  message  gt  lt span gt   message  time     lt  span gt   message  message     lt  div gt                                           Without the   each function I am able to successfully parse single JSON objects  but not an array   This is my first outing with JSON and   each  and I m pretty new to jQuery  so go easy if my code has ugly bits

User · Answer

Your data is a string of        at that point in time  you can eval it like so   function data        data   eval        data             However this method is far from secure  this will be a bit more work but the best practice is to parse it with Crockford s JSON parser  https   github com douglascrockford JSON-js   Another method would be   getJSON and you ll need to set the dataType to json for a pure jQuery reliant method

User · Answer

I know this is pretty long after your post  but wanted to post for others who might be experiencing this issue and stumble across this post as I did    It seems there s something about jquery s   each that changes the nature of the elements in the array   I wanted to do the following     getJSON   ajax get messages php   function data            data           title   Failure   details   Unsuccessful  Please try again    type   error          title   Information Message   details   A basic informational message - Please be aware   type   info                 console log   Data0Title      data 0  title          prints  Data0Title  Failure       console log   Data0Type      data 0  type          prints  Data0Type  error       console log   Data0Details      data 0  details          prints  Data0Details  Unsuccessful  Please try again           Loop through data array and print messages to console           To accomplish the loop  I first tried using a jquery   each to loop through the data array  However  as the OP notes  this doesn t work right     each data  function nextMsg            console log  nextMsg title          nextMsg type           nextMsg details          prints          undefined  undefined   undefined         undefined  undefined   undefined       This didn t exactly make sense since I am able to access the data 0  elements when using a numeric key on the data array  So since using a numerical index worked  I tried  successfully  replacing the   each block with a for loop   var i 0  for  i 0 i lt data length i         console log  data i  title          data i  type           data i  details          prints         Failure  error   Unsuccessful  Please try again          Information Message  info   A basic informational message - Please be aware      So I don t know the underlying problem  a basic  old fashioned javascript for loop seems to be a functional alternative to jquery s   each

User · Answer

Do NOT eval  use a real parser  i e   from json org

User · Answer

You can use the Javascript eval   function to parse the JSON for you  See the JSON website for a better explanation  but you should be able to change your success function to     var returnedObjects   eval data   var i   0  for  i   0  i  lt  returnedObjects length  i         console log  Time      returnedObjects i  time          or something close

User · Answer

Using  NET 3 5 FIX  All of you are slightly wrong  but the combination of all of your efforts has paid off   Instead of eval        jsonData          do   success  function msg   var data   eval msg d   var i 0  for i 0 i lt data length i         data i  parametername     do whatever you want here       I don t know anything about the whole  don t use eval   but what I do know is that by doing the        msg        you are nesting those objects deeper  instead of up a level

User · Answer

No  with eval is not safe  you can use JSON parser that is much safer  var myObject   JSON parse data   For this use the lib https   github com douglascrockford JSON-js

User · Answer

jQuery parseJSON - new in jQuery 1 4 1

User · Answer

You can download a JSON parser from a link on the JSON org website which works great  you can also stringify you JSON to view the contents   Also  if you re using EVAL and it s a JSON array then you ll need to use the following synrax    eval        jsonData

User · Answer

I am trying to parse JSON data returned from an ajax call  and the following is working for me   Sample PHP code   portfolio array  Array  desc   gt  This is test description1   item1   gt  1 jpg   item2   gt  2 jpg     echo json encode  portfolio array     And in the  js  i am parsing like this   var req   post  json php     id       id        function data        data   parseJSON data       alert data desc         each data  function i item       alert item               success function       error function   alert  There was problem loading portfolio details        complete function         If you have multidimensional array like below   portfolio array  Array  desc   gt  This is test description 1   items   gt  array  item1   gt  1 jpg   item2   gt  2 jpg     echo json encode  portfolio array     Then the code below should work   var req   post  json php     id       id        function data        data   parseJSON data       alert data desc         each data items  function i item       alert item               success function       error function   alert  There was problem loading portfolio details        complete function         Please note the sub array key here is items  and suppose if you have xyz then in place of data items use data xyz

User · Answer

Careful with the eval  the JSON specs http   json org js html recommend something like  var myObject   eval       myJSONtext           And there may be some more gotchas  There is a plugin for jQuery that will take care of it  i guess   http   code google com p jquery-json

[jquery] How to parse JSON array in jQuery?

Examples related to jquery

Examples related to arrays

Examples related to json

Examples related to each