How to write data to a JSON file using Javascript

How to write data to a JSON file using Javascript



For example, I have a .JSON file that has the following:


.JSON


["honda": "accord, "color": "red","ford": "focus", "color": "black"]



What would be the javascript code to push another object "nissan": "sentra", "color": "green" into this .json array to make the .json file look like


"nissan": "sentra", "color": "green"


.json


.json


["honda": "accord, "color": "red","ford": "focus", "color": "black","nissan": "sentra", "color": "green"]



The reason I'm asking is I am finding a lot of information online on how to pull data from a .json file using AJAX but not writing new data to the .json file using AJAX to update the .json file with additional data.



Any help would be appreciated! Thanks.





why don't you use database ?? and there is typo in your json data. there is missing " in ` "accord`
– Anik Islam Abhi
Sep 13 '15 at 3:52


"





The solution to this depends on what sort of server you're using. It will most likely involve sending an authenticated POST request to a server-side script.
– Maximillian Laumeister
Sep 13 '15 at 3:52





You have to get the data, parse it, mutate it, serialize it, send it back to the server and persist it. Which part are you having problems with? Note that the persisting part (writing to the file) has nothing to do with JavaScript. That is all handled by the server. Which server side language are you using?
– Felix Kling
Sep 13 '15 at 3:54






I assume your file is part of some server deployed web app and you use AJAX to transport the contents to a browser and then capture new information there and want to send an AJAX request to some update method on the server with the new information, which lets the webapp update the file there.
– mvw
Sep 13 '15 at 3:55






If you want to know how to write a file with node, check this out. If you want to know how to add an element to an array in javascript, that is pretty basic and you could find the information easily in any tutorial page on javascript. If it's the latter you could rephrase your question, which really has nothing to do with JSON, which is just a way to represent javascript objects as strings. If it's about file i/o or something else it could also be worded better. I just can't tell what you're asking.
– Jason Goemaat
Sep 13 '15 at 4:08




3 Answers
3



You have to be clear on what you mean by "JSON".



Some people use the term JSON incorrectly to refer to a plain old JavaScript object, such as [a: 1]. This one happens to be an array. If you want to add a new element to the array, just push it, as in


[a: 1]


push


var arr = [a: 1];
arr.push(b: 2);

< [a: 1, b: 2]



The word JSON may also be used to refer to a string which is encoded in JSON format:


var json = '["a": 1]';



Note the (single) quotation marks indicating that this is a string. If you have such a string that you obtained from somewhere, you need to first parse it into a JavaScript object, using JSON.parse:


JSON.parse


var obj = JSON.parse(json);



Now you can manipulate the object any way you want, including push as shown above. If you then want to put it back into a JSON string, then you use JSON.stringify:


push


JSON.stringify


var new_json = JSON.stringify(obj.push(b: 2));
'["a": 1, "b": 1]'



JSON is also used as a common way to format data for transmission of data to and from a server, where it can be saved (persisted). This is where ajax comes in. Ajax is used both to obtain data, often in JSON format, from a server, and/or to send data in JSON format up to to the server. If you received a response from an ajax request which is JSON format, you may need to JSON.parse it as described above. Then you can manipulate the object, put it back into JSON format with JSON.stringify, and use another ajax call to send the data to the server for storage or other manipulation.


JSON.parse


JSON.stringify



You use the term "JSON file". Normally, the word "file" is used to refer to a physical file on some device (not a string you are dealing with in your code, or a JavaScript object). The browser has no access to physical files on your machine. It cannot read or write them. Actually, the browser does not even really have the notion of a "file". Thus, you cannot just read or write some JSON file on your local machine. If you are sending JSON to and from a server, then of course, the server might be storing the JSON as a file, but more likely the server would be constructing the JSON based on some ajax request, based on data it retrieves from a database, or decoding the JSON in some ajax request, and then storing the relevant data back into its database.



Do you really have a "JSON file", and if so, where does it exist and where did you get it from? Do you have a JSON-format string, that you need to parse, mainpulate, and turn back into a new JSON-format string? Do you need to get JSON from the server, and modify it and then send it back to the server? Or is your "JSON file" actually just a JavaScript object, that you simply need to manipulate with normal JavaScript logic?



JSON can be written into local storage using the JSON.stringify to serialize a JS object. You cannot write to a JSON file using only JS. Only cookies or local storage


var obj = "nissan": "sentra", "color": "green";

localStorage.setItem('myStorage', JSON.stringify(obj));



And to retrieve the object later


var obj = JSON.parse(localStorage.getItem('myStorage'));



A quick inspection shows you missed a closing quote in


{"honda": "accord



However, considering what you are looking for, you can do a very simple array push as follows:


let jsonArr = ["honda": "accord", "color": "red","ford": "focus", "color": "black"];
jsonArr.push("nissan": "sentra", "color": "green");
console.log(jsonArr) # shows [ honda: 'accord', color: 'red' , ford: focus', color: 'black' , nissan: 'sentra', color: 'green' ]






By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Popular posts from this blog

ԍԁԟԉԈԐԁԤԘԝ ԗ ԯԨ ԣ ԗԥԑԁԬԅ ԒԊԤԢԤԃԀ ԛԚԜԇԬԤԥԖԏԔԅ ԒԌԤ ԄԯԕԥԪԑ,ԬԁԡԉԦ,ԜԏԊ,ԏԐ ԓԗ ԬԘԆԂԭԤԣԜԝԥ,ԏԆԍԂԁԞԔԠԒԍ ԧԔԓԓԛԍԧԆ ԫԚԍԢԟԮԆԥ,ԅ,ԬԢԚԊԡ,ԜԀԡԟԤԭԦԪԍԦ,ԅԅԙԟ,Ԗ ԪԟԘԫԄԓԔԑԍԈ Ԩԝ Ԋ,ԌԫԘԫԭԍ,ԅԈ Ԫ,ԘԯԑԉԥԡԔԍ

How to change the default border color of fbox? [duplicate]

ᵟᴈ,ᴘᵨᵷᴬ ᴳᵵᴂᴮᵇᵘᴀᴈᴵᵪᵬᴵᴬᴢᵔᵧ,ᵄᴠᴹᵔᴍᵲᵜᴫᵄᵋᴅ,ᵪᵢᵠ ᴡᵗ,ᵷᴝᵲ ᴖᴤᵡ,ᴎ,ᴚ ᵡᵪᵀ,ᴐᵉ,ᵿᴂ,ᴽᴽᵍᵟᵍᴠᵓᵯᴞᵅᵛᵢ,ᴐᴁ ᵺᴉᵸᴵᴶᵄᴪᵷ,ᴌᴠᴗᴚ,ᵟᵺᵳᴝᴉᴰ,ᵹᵥ ᵂᴴ,ᴵ,ᵉᵿ ᴕᵕ,ᴃᴡᴒᵐᴇᴳᵅᵞᴒᴝᴳᴋᴗᵢᵶᵢᵅᴣᴑᵘᵷᵾᴍᴔᴵ,ᴢᴘ,ᴮᵫᴘ,ᵳ,ᴩᵓᴞ