Toxa26
@Toxa26
Студент. Люблю верстать сайты.

Как перезаписать данные в json файле?

Всем привет!
У меня есть json файл в котором имеется массив объектов(список людей с именем и фамилией):
[{ "firstName" : "Антон", "lastName" : "Фролов" }, { "firstName" : "Андрей", "lastName" : "Данилов" }]

Есть простая HTML структура с двумя кнопками и 2 полями ввода, 1я кнопка выводит данные с json файла, а 2я добавляет в массив нового человека с введенными данными(Имя и Фамилия), над качеством кода особо не заморачивался, просто набросал структуру:
<input id="getJson" type="button" value="Список людей" />
<p id="output"></p><br /><br />
Добавить человека: <br /><br />
Имя: <input id="nameField" type="text"><br /><br />
Фамилия: <input id="surnameField" type="text"><br /><br />
<input id="saveBtn" type="button" value="Save" />

Ну и сам js код, который асинхронно подгружает данные json'a и задает действия под кнопки:
var getJson = document.getElementById("getJson");
var saveBtn = document.getElementById("saveBtn");
var xhr = new XMLHttpRequest();
var data;

function reload() {
    xhr.open("GET", "test.json");
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {
            data = JSON.parse(xhr.responseText);
            document.getElementById("output").innerHTML = '';
            for(var i = 0; i < data.length; i++){
                document.getElementById("output").innerHTML += "Имя - " + data[i].firstName + ", Фамилия - " + data[i].lastName + "<br />";
            }
        }
    }
    xhr.send();
}

reload();
getJson.onclick = reload;

saveBtn.onclick = function () {
    var newName = document.getElementById("nameField").value;
    var newSurname = document.getElementById("surnameField").value;
    var newPerson = { "firstName" : newName, "lastName" : newSurname };
    data.push(newPerson);
}


Ну а теперь сам вопрос, как мне реализовать сохранение данных в этом же json файле, тоесть когда я нажимаю на кнопку SAVE, данные не просто сохранялись в массив людей, но и добавлялись в json файл, при этом если я еще раз нажму на кнопку что бы вывести список людей после добавления, то выводилось актуальное кол-во, так как все по идее работает без перезагрузки страницы.
Заранее благодарен за идеи и возможно за готовые решения!
  • Вопрос задан
  • 1181 просмотр
Пригласить эксперта
Ответы на вопрос 1
hzzzzl
@hzzzzl
в смысле сохранить файл из скрипта в браузере?
никак не выйдет, у браузера нет доступа к файловой системе

в node.js через fs.writeFile(filename, JSON.stringify(json))
https://nodejs.org/api/fs.html#fs_fs_writefile_fil...

--

впрочем еще можно так, если надо сохранить json себе на комп
https://codepen.io/anon/pen/PLyEeZ
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы