user6383603 user6383603 - 2 months ago 9
Ajax Question

getJSON subset from API to display on a web

I'm trying to scrape some data from an API and turn data into my own website.

The API get request:
http://api.reliefweb.int/v1/jobs?preset=latest&filter[field]=status&filter

I tried to display all the "titles" from that api in my own website. But somehow it doesn't work. I am sure I have jquery installed. with the code snippet:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>


But nothing shows up when I'm loading the html file.

<!DOCTYPE HTML>

<html>
<head>
<title>Relief Web</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

<script>

$(document).ready(function() {

$.getJSON('http://api.reliefweb.int/v1/jobs?preset=latest&filter[field]=status&filter', function(reliefResult) {

document.write(reliefResult.title);

});

});
<script>

</head>
<body>
</body>
</html>

Answer

$(document).ready(function() {

  $.getJSON('http://api.reliefweb.int/v1/jobs?preset=latest&filter[field]=status&filter', function(reliefResult) {

    reliefResult.data.forEach(function(record) {
      $('body').append('<div>' + record.fields.title + '</div>');

    });

  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>