filtering data from a local json file with javascript

Question

What i'm trying to do is create an app that can be used offline. I have my data stored in a local json file and I would like to be able to filter that json data without it being hardcoded in a javascript file- these are only the examples I have seen for this.

This is a short example of my json file:

[

    {
        "ID": 1 ,
        "name": "sub conjunctival haemorrhage",
        "score" : 1,
        "surgeryType": ["scleral buckle", "general", "ppv"] 
    },
    {
        "ID": 2,
        "name": "dry eye",
        "score": 5,
        "surgeryType":["general", "pr"]
    }

]

this filter below works but I don't know how to do it without hardcoding the data in the javascript file. How would I search by 'surgery type' but still keep the json in a json file instead of what is below?

<script>

    var jsonText = '[
              {
                 "ID":1,
                "name":"sub conjunctival haemorrhage",
                "score":1,
                "surgeryType":["scleral buckle","general","ppv"]},
              {
                 "ID":2,
                 "name":"dry eye",
                 "score":5,
                 "surgeryType":["scleral buckle","pr"]}]';

    var jsonArray = JSON.parse(jsonText);

    var surgerySearchTerm = "scleral buckle";
    var filtered = jsonArray.filter(jsonObject => 
    jsonObject.surgeryType.includes(surgerySearchTerm));

    console.log("Filtered below");
    console.log(filtered);
    
    

</script>

You can serve your json file from a node.js application or you can upload it to server and directly access it. If you are going to be full offline, you can access your file from local. Also may help; https://expressjs.com/en/starter/static-files.html — Tugay İlik, Jul 20 '21 at 10:19
Does this answer your question? [Loading local JSON file](https://stackoverflow.com/questions/7346563/loading-local-json-file) — Dexygen, Jul 20 '21 at 10:19
hmmm perhaps I'm not explaining myself correctly. I've used 'fetch' to retrieve all of the data (which works and i'm using a live server) and my teachers says thats ok as long as the json file is uploaded in the web directory so published in the project, but what I want to know is how do I get that 'var jsonText' above to get the data from the json file rather than putting the data in the javascript file? I could totally be misunderstanding a lot of things here as I can't find the answer I think I want anywhere!! — Jen-cc, Jul 20 '21 at 10:43

score 1 · Answer 1 · edited Jul 20 '21 at 12:48

If you just want to load the json file is impossible,but you can loaded it as a js file ,and only need a little modification Suppose your json file name is data.js . Contents in data.js are blew

var jsonArray = [

{
    "ID": 1 ,
    "name": "sub conjunctival haemorrhage",
    "score" : 1,
    "surgeryType": ["scleral buckle", "general", "ppv"] 
},
{
    "ID": 2,
    "name": "dry eye",
    "score": 5,
    "surgeryType":["general", "pr"]
},.....
]

The html code are

<script src='data.js'>
<script>
       var surgerySearchTerm = "scleral buckle";
       var filtered = jsonArray.filter(jsonObject => 
       jsonObject.surgeryType.includes(surgerySearchTerm));

       console.log("Filtered below");
       console.log(filtered);
</script>

thank you . Guess that's why I couldn't find an answer to it then! appreciate it — Jen-cc, Jul 20 '21 at 14:02

filtering data from a local json file with javascript

1 Answers1