Html5 filereader - read local Json Array file and display only a specific section

filereader, javascript, json

Solution

If you get the text with fr.readAsText into a string, you can use JSON.parse() (see: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse) to convert the string into a JSON object. Then you can access your specific content like a normal array.

Problem

I'm a beginner and come form VBA excel programming tool. Reading excel file, manipulating excel content is a lot easier in VBA than the web tool like Filereader and Json array. I have the following content in my Json array file. ``` [ ["TWE",6000,4545.5 ], ["RW",1000,256.3 ] ] ``` I would like to read from the following html file and display only the value 253.6 Can you help me. Here the Html file reader example ``` <!DOCTYPE html> <html> <head> <script> function handleFileSelect() { if (window.File && window.FileReader && window.FileList && window.Blob) { } else { alert('The File APIs are not fully supported in this browser.'); return; } input = document.getElementById('fileinput'); if (!input) { alert("Um, couldn't find the fileinput element."); } else if (!input.files) { alert("This browser doesn't seem to support the `files` property of file inputs."); } else if (!input.files[0]) { alert("Please select a file before clicking 'Load'"); } else { file = input.files[0]; fr = new FileReader(); fr.onload = receivedText; fr.readAsText(file); } } function receivedText() { //result = fr.result; document.getElementById('editor').appendChild(document.createTextNode(fr.result)) } </script> </head> <body> <input type="file" id="fileinput"/> <input type='button' id='btnLoad' value='Load' onclick='handleFileSelect();'> <div id="editor"></div> </body> </html> ```

Original source