Javascript get value from JSON file

Question

I have the following 2 files, an HTML file and a JSON file called data.txt

In the JSON:

myFunction([
{
"itemid": "0",
"itemname": "air",
"currentprice": "5.0"
},
{
"itemid": "1",
"itemname": "stone",
"currentprice": "5.0"
},
{
"itemid": "2",
"itemname": "grass",
"currentprice": "5.0"
},
{
"itemid": "3",
"itemname": "dirt",
"currentprice": "5.0"
},
{
"itemid": "4",
"itemname": "cobblestone",
"currentprice": "5.0"
},
{
"itemid": "5",
"itemname": "plank",
"currentprice": "5.0"
}
]);

So basically, to my knowledge the only way to modify or view data from this file is with a loop like the following:

<div id="id01"></div>

<script>
function myFunction(arr) {
    var out = "";
    var i;
    for(i = 0; i<arr.length; i++) {
        out += '<a href="' + arr[i].url + '">' + arr[i].itmid + '</a><br>';
    }
    document.getElementById("id01").innerHTML = out;
}
</script>

<script src="data.js"></script>

My questions is this, is there a way to directly edit the values without a loop, possibly similar to editing arrays like itemid[number] = "customValue"

possible duplicate of [Updating a JSON object using Javascript](http://stackoverflow.com/questions/8702474/updating-a-json-object-using-javascript) [if the contents of data.txt are saved to a Javascript object using JSON notation] — alex, Dec 31 '14 at 18:24
It's not a duplicate, that link has a variable in the JSON, I don't. I'm using an array literal as the argument — Dragneel, Dec 31 '14 at 18:30

Shahar · Accepted Answer · 2014-12-31T18:36:14.123

2

I find it hard to understand what you're asking for. Are you having trouble parsing the JSON file? If so, do:

var str = '{"stuff":[{"itemid": "0","itemname": "air","currentprice": "5.0"},{"itemid": "1","itemname": "stone","currentprice": "5.0"},{"itemid": "2","itemname": "grass","currentprice": "5.0"},{"itemid": "3","itemname": "dirt","currentprice": "5.0"},{"itemid": "4","itemname": "cobblestone","currentprice": "5.0"},{"itemid": "5","itemname": "plank","currentprice": "5.0"}]}';
var json = JSON.parse(str); //str is the json
for (int i = 0; i < json.stuff.length; i++)
{
    //Do whatever with json.stuff[i]. i.e.:
    document.getElementById("id01").innerHTML += json.stuff[i].itemid; // puts each item's ID
}

UPDATE: To save the JSON to a file on your server, you'll need to have a server-sided script. You probably want to send an AJAX HTTP POST request to your script with the JSON string, and then the script will update your file.

Since it's on your computer, you can just save it using JavaScript. After you modifying the json variable, you can do:

var blob = new Blob([JSON.stringify(json)], {type: "text/plain;charset=utf-8"});
saveAs(blob, "thefile.txt");

edited Dec 31 '14 at 18:36

answered Dec 31 '14 at 18:29

Shahar

1,687
2
12
18

I understand, but I'm trying to keep the data in the data.txt file, and not the HTML file. – Dragneel Dec 31 '14 at 18:32
Where is data.txt located? On your computer? On a server? – Shahar Dec 31 '14 at 18:33
Yea everything is in a folder. – Dragneel Dec 31 '14 at 18:36
@LawrenceLelo Look at my update. – Shahar Dec 31 '14 at 18:39
why is there a var str with all the data, when the data is in data.txt – Dragneel Dec 31 '14 at 18:49
@LawrenceLelo That was for me to test it personally. For you, the `str` will be whatever you read from the file. However, you should give a name to your array. For instance, I named my array `stuff` and accessed it like `json.stuff`. – Shahar Dec 31 '14 at 18:50
Hmm if you think it's the better idea I'll go with it. I only chose it because it seemed like a good idea, basically there is 2 ways of doing it if you look at http://www.w3schools.com/json/json_files.asp – Dragneel Dec 31 '14 at 18:58
Hey man quick question, the example here http://pastebin.com/xQFBdRRz would it be possible moving that data with the variable 'text' to its own .txt file? – Dragneel Dec 31 '14 at 19:12
@LawrenceLelo As I said, yes. You can put it in a separate text file and read the file to load the variable. – Shahar Dec 31 '14 at 20:44

score 0 · Answer 2 · answered Dec 31 '14 at 18:25

0

You can use the array index to hop directly into a specific item.

function myFunction(arr) {
    console.log(arr[0].itemid);
    console.log(arr[0].itemname);
    console.log(arr[0].currentprice);

    console.log(arr[1].itemid);
    console.log(arr[1].itemname);
    console.log(arr[1].currentprice);
}

answered Dec 31 '14 at 18:25

Chris Cherry

28,118
6
68
71

I think that's exactly what I'm looking for. I already have a function called myFunction which is being used. How would I use your code in a different function name? Is it possible? – Dragneel Dec 31 '14 at 18:33
@LawrenceLelo You would rename "myFunction" to whatever else you want. – alex Dec 31 '14 at 18:38

score 0 · Answer 3 · answered Dec 31 '14 at 18:39

0

If you're using jQuery you can do something like so:

$.grep(a, function(e){ return e.itemid == 1; });

answered Dec 31 '14 at 18:39

Todd Sharp

3,207
2
19
27

Javascript get value from JSON file

3 Answers3