html read json input

Question

I'm trying to read json input(like in https://jsonformatter.curiousconcept.com/) in html and pass it to js function to convert json to html table. I'm new to html,js, please help me read json input

<body>
    <input type="text" id="jsondata" name="jsondata" />
    <input type="button" onclick="CreateTableFromJSON(document.getElementById('jsondata').value)" value="Create Table From JSON" />
    <p id="showData"></p>
</body>

<script>
    function CreateTableFromJSON(json) {
        var x = JSON.stringify(json);
        var myJson = JSON.parse(x);

score 0 · Accepted Answer · answered Mar 29 '20 at 02:00

Input.value is already a string. You just have to parse it.

function CreateTableFromJSON(json) {
  var myJson = JSON.parse(json);
  console.log(myJson)
}

<input type="text" id="jsondata" name="jsondata" value='{"name":"John","age":31,"city":"New York"}' />
<input type="button" onclick="CreateTableFromJSON(document.getElementById('jsondata').value)" value="Create Table From JSON" />
<p id="showData"></p>

html read json input

1 Answers1

Linked