Display json data from jQuery.ajax in HTML using loop

user_4939530 0
Viewed 12605

Hello suppose I have the following ajax call:

jQuery.ajax({
    type: "GET",
    url: "https://myurl.com",
    success: function(data)
    {
        console.log(data);
    }
});

That results in the following json data (in my console)

{
  "meta": {
    "last_updated": "2017-07-06"
  },
  "results": [
    {
      "term": "DRUG INEFFECTIVE",
      "count": 1569
    },
    {
      "term": "NAUSEA",
      "count": 1374
    },
    {
      "term": "FATIGUE",
      "count": 1371
    }
  ]
}

How can I populate a div in my HTML page with this data in a format something like:

term: x
count: xx

term: x
count: xx

term: x
count: xx

I am not interested in the "meta" stuff only the "results"

Anyone know how to use a simple loop to display this data?

Thanks!

html jquery json ajax
3 Answers

You want the success data which you receive in json format and for that, you first need to convert it in array to get the data

data = jQuery.parseJSON(data);

this will help you to receive the data in an array format and then you will do whatever you want to do with the data.

For more info look at these answers How to display JSON data with jQuery Ajax?

user_40002660 
StudentViewModel EmpInfo = new StudentViewModel();

        HttpClient client1 = new HttpClient();
        client1.BaseAddress = new Uri("http://localhost:2585/");

        client1.DefaultRequestHeaders.Accept.Add(
            new MediaTypeWithQualityHeaderValue("application/json"));

        var responsecountry = client1.GetAsync("api/Country/").Result;
        List<SelectListItem> country = new List<SelectListItem>();


        HttpClient client = new HttpClient();
        client.BaseAddress = new Uri("http://localhost:2585/");

        client.DefaultRequestHeaders.Accept.Add(
            new MediaTypeWithQualityHeaderValue("application/json"));

        var response = client.GetAsync("api/StudentApi/" + id).Result;


        if (response.IsSuccessStatusCode)
        {
            EmpInfo = JsonConvert.DeserializeObject<StudentViewModel>(response.Content.ReadAsStringAsync().Result);
            if (responsecountry.IsSuccessStatusCode)
            {
                country = JsonConvert.DeserializeObject<List<SelectListItem>>(responsecountry.Content.ReadAsStringAsync().Result);
                EmpInfo.Country = country;
            }
            return PartialView(EmpInfo);
        }
user_84950370
Related