Posting data from JQUERY API into HTML

Question

I'm by no means an expert. At the company I work for, we are having an external company develop a website for us. We sell a variety of products and would like to create an API to keep everything up to date. I created the API using kimonolabs and that went smoothly and it's fetching the information I want. My question is, how do I get it to show up in divs and other tags so I can style the information. Here is what I've got. I just need to know what to put in the comment section //do something with response.

<script>
  $.ajax({
  url:"https://www.kimonolabs.com/api/balbvqjq?apikey=AxJK7bN6CCfuHxT46W9WAIHV2PhIrEt4",
  crossDomain: true,
  dataType: "jsonp",
  success: function (result) {
      alert('It Works!');
    //Do something with the response

  },
  error: function (xhr, status) {
    //handle errors
  }
});
</script>

I just need to know the basics to get the ball rolling.

It depends what the response is. If it's HTML, you can just write it in a div : `$("#somediv").append(result)`. — Jeremy Thille, Feb 13 '15 at 16:16
Ah sorry, type is jsonp, so you get JSON. So you can iterate in the json with `$.each(result, function(i,obj) ` ... see here : http://stackoverflow.com/questions/4233354/how-to-iterate-json-data-in-jquery — Jeremy Thille, Feb 13 '15 at 16:18

score 1 · Answer 1 · answered Feb 13 '15 at 16:23

A simple tutorial For you..

Suppose the result stores

{
    "name": "mkyong",
    "age": 30,
    "address": {
        "streetAddress": "88 8nd Street",
        "city": "New York"
    },
    "phoneNumber": [
        {
            "type": "home",
            "number": "111 111-1111"
        },
        {
            "type": "fax",
            "number": "222 222-2222"
        }
    ]
}

Then possible use cases to fetch the values are

alert(result["name"]); //mkyong
alert(result.name); //mkyong

alert(result.address.streetAddress); //88 8nd Street
alert(result["address"].city); //New York

alert(result.phoneNumber[0].number); //111 111-1111
alert(result.phoneNumber[1].type); //fax

alert(result.phoneNumber.number); //undefined

Posting data from JQUERY API into HTML

1 Answers1