0

I want to replace the JSON in my HTML with a URL endpoint (http://localhost:3000/staff) that has the same JSON data. Any idea how I could go about doing that? Preferable without using jQuery.

        <div class="panel" data-title="Staff" id="staff_panel">
            <li class="divider">ACADEMIC</li>
            <ul class="list">
                <div id='stringifiedJSON_academic_staff'></div>
            </ul>
        </div>

<script type="text/javascript">
var people;

    people = [
      { first_name: 'Don Molloy', category: 'academic' },
      { first_name: 'Pat Quill', category: 'academic' },
      { first_name: 'Regina Mundi', category: 'administrative' },
      { first_name: 'Pat Flynn', category: 'technical' }
    ];

for (var i = 0; i < people.length; i++) {
    console.log(i, people[i].first_name);

    if (people[i].category == 'academic') {
        console.log(people[i].first_name);
        var stringifiedJSON_academic_staff = '<li><a href="https://www.w3schools.com/html/">'+JSON.stringify(people[i].first_name+'</a></li>');
        document.getElementById('stringifiedJSON_academic_staff').innerHTML += stringifiedJSON_academic_staff;
    }
}

Kerbol
  • 588
  • 2
  • 9
  • 24
  • What do you mean replace the object with a JSON URL? – bamtheboozle May 17 '17 at 20:05
  • Use the duplicate question to load the data. Then use `JSON.parse` to convert from JSON to an object/array. – Mike Cluck May 17 '17 at 20:06
  • @Dragoş Paul Marinescu - Apologies, just updated the post, hopefully that makes more sense. – Kerbol May 17 '17 at 20:08
  • @Mike C - thanks for referencing that. How would you use it in this instance? could you provide a code snippet? thanks – Kerbol May 17 '17 at 20:11
  • @kamol22 Exactly as the answers indicate. Load your data from a file using `XmlHttpRequest` or `fetch` then convert the response to an object/array using `JSON.parse`. You need to move your data into a JSON file and make sure you are running a server or have your browser running in a mode where it allows loading local files. – Mike Cluck May 17 '17 at 20:14

0 Answers0