Question

I have this json object :

[
    {
        "company_name": "Spix Clothing Co."
    },
    {
        "company_name": "spixel"
    },
    {
        "company_name": "WebNiJose Co."
    }
]

As you can see, its an object without a name, and has 3 objects within it.

I wonder if how am I suppose to handle this. I want each one to be in appended in <ul></ul>.

By the way, that is a response from an ajax call, like this:

success : function(output) {
     console.log(output);
}

And the php file fire that like this:

echo json_encode($result);

How do you think is the best way to handle that?

Answer 1

The response that you’re receiving is actually an array so you would handle this situation as follows:

• Parse the string into an object that you can use in javascript:

  var companyObject = JSON.parse(output);

• Loop through the array and pull out the object attributes and create a new <li> element to contain for example the company name. JQuery provides an automatic index for us to use if you wish. (Assuming your markup already has an <ul> element with an id of “container”.)

  var $container = $('#container');            // where to append the <li>
  $.each(companyObject,function(i,company){
      var $newElement = $('<li/>');            // create a new <li> element
      $newElement.html(company.company_name);
      $container.append($newElement);          // attach the new <li> element
  });​​
  

Here is a full example: http://jsfiddle.net/mNzm9/2/