I'm trying to read, parse and display the elements of a JSON for my extension, but somehow it's not getting displayed.
My code before the HTML part in _getHtmlForWebview(), where I declare the array is this:
const fs = require('fs');
const configsList = fs.readFileSync('./configuration.json', 'utf8');
Everything works here, I tried console.log(configList) and the array is printed as it should. So no problems here.
Next I tried to iterate over the data array in the HTML like this (just parts):
In the <HTML> part:
function displayConfigs() {
var mainContainer = document.getElementById("target-id");
data = ${configList}
for (var i = 0; i < data.length; i++) {
var div = document.createElement("div");
div.innerHTML = 'Config ID: ' + data[i].id + ', Config Name: ' + data[i].name;
mainContainer.appendChild(div);
}
}
And executing it in the <Script> part:
<span onclick="displayConfigs()"><button> <strong>Display Configs</strong> </button></span>
<div id="target-id"></div>
But after pressing the button in my webview, nothing happens