JSON object not showing values.. Can someone help
-
Code is here:-
{% csrf_token %}
//Your string
let a = "{{models}}"
a = a.replace(/"/g, '"');
a = a.replace(/(?:\r\n|\r|\n)/g, '');let stringToParse = JSON.stringify(a);
//document.body.innerHTML = `<p> Received String: ${stringToParse}</p>`;//Converting your string to object
let convertedToObject = JSON.parse(stringToParse);
document.body.innerHTML = `<p> Received String: ${convertedToObject}</p>`;//Getting the boardMembers list from your parsed object
let listBoardMembers = convertedToObject.boardMembers;
let listExecutives = convertedToObjects.executives;document.body.innerHTML = `<p> listboard: ${listBoardMembers}</p>`;
document.body.innerHTML = `<p> listexecutives: ${listExecutives}</p>`;//Creating Elements on HTML (creating a Paragraph with the received data and a container for the list of members). *Notice: I've created a "DIV" (container) with a unique ID ("listMembers"). This is important because when I start to iterate the members I will add them inside the container, and for that, I need to reference it using an ID.*
//document.body.innerHTML = `<p> Received String: ${convertedToObject}</p>`;
document.body.innerHTML += `<div id="listMembers"></div>`;//Iterating the list of boardMembers using this length;
for (let i = 0; i < listBoardMembers.length; i++) {
let member = listOfMembers[i];let memberName = member.name;
let memberImageURL = '';// Verify if the user has thumbnail
if (member.thumbnail !== null){
memberImageURL = member.thumbnail.url;
}//Adding this member to the member's container, using the container ID, that we created previously.
document.getElementById('listMembers').innerHTML += `
<div style="display: flex;">
<img src="${memberImageURL}">
<h1>${memberName}</h1>
</div>
`;
}JSON object is here:-
{"boardMembers": [{"id": "7394026", "name": "Stephen Joseph Squeri", "slug": "7394026-stephen-joseph-squeri", "companyName": "American Express Co", "company": {"id": "AXP:US", "name": "American Express Co"}, "webVisibility": true}, {"id": "3994082", "name": "Ronald A Williams "Ron"", "slug": "3994082-ronald-a-williams-"ron"", "companyName": null, "company": null, "webVisibility": false}, {"id": "1439479", "name": "Theodore J. Leonsis", "slug": "1439479-theodore-j-leonsis", "companyName": "
-
Code is here:-
{% csrf_token %}
//Your string
let a = "{{models}}"
a = a.replace(/"/g, '"');
a = a.replace(/(?:\r\n|\r|\n)/g, '');let stringToParse = JSON.stringify(a);
//document.body.innerHTML = `<p> Received String: ${stringToParse}</p>`;//Converting your string to object
let convertedToObject = JSON.parse(stringToParse);
document.body.innerHTML = `<p> Received String: ${convertedToObject}</p>`;//Getting the boardMembers list from your parsed object
let listBoardMembers = convertedToObject.boardMembers;
let listExecutives = convertedToObjects.executives;document.body.innerHTML = `<p> listboard: ${listBoardMembers}</p>`;
document.body.innerHTML = `<p> listexecutives: ${listExecutives}</p>`;//Creating Elements on HTML (creating a Paragraph with the received data and a container for the list of members). *Notice: I've created a "DIV" (container) with a unique ID ("listMembers"). This is important because when I start to iterate the members I will add them inside the container, and for that, I need to reference it using an ID.*
//document.body.innerHTML = `<p> Received String: ${convertedToObject}</p>`;
document.body.innerHTML += `<div id="listMembers"></div>`;//Iterating the list of boardMembers using this length;
for (let i = 0; i < listBoardMembers.length; i++) {
let member = listOfMembers[i];let memberName = member.name;
let memberImageURL = '';// Verify if the user has thumbnail
if (member.thumbnail !== null){
memberImageURL = member.thumbnail.url;
}//Adding this member to the member's container, using the container ID, that we created previously.
document.getElementById('listMembers').innerHTML += `
<div style="display: flex;">
<img src="${memberImageURL}">
<h1>${memberName}</h1>
</div>
`;
}JSON object is here:-
{"boardMembers": [{"id": "7394026", "name": "Stephen Joseph Squeri", "slug": "7394026-stephen-joseph-squeri", "companyName": "American Express Co", "company": {"id": "AXP:US", "name": "American Express Co"}, "webVisibility": true}, {"id": "3994082", "name": "Ronald A Williams "Ron"", "slug": "3994082-ronald-a-williams-"ron"", "companyName": null, "company": null, "webVisibility": false}, {"id": "1439479", "name": "Theodore J. Leonsis", "slug": "1439479-theodore-j-leonsis", "companyName": "