Файл json в таблице crud в javascript

Я работаю над таблицей CRUD с кодами javascript. я получаю данные таблицы из внешнего файла JSON. у меня есть один вопрос: как я могу удалить одну строку в таблице, и эта строка в файле JSON удаляется одновременно? это означает автоматическое обновление данных в файле json. большое спасибо

На клиенте просто удалите элемент из массива JSON и одновременно отправьте запрос в какую-нибудь службу на изменение файла. На сервере просто полностью перезапишите файл новой строкой JSON. Какой фреймворк или язык вы используете на стороне сервера?

Shilly 10.09.2018 11:36

Я не использую язык на стороне сервера. Я новичок в javascript, и я хочу знать, что это можно сделать на стороне клиента или нет.

Seyed-Amir-Mehrizi 10.09.2018 11:40
2
2
840
1

Ответы 1

Это возможно на стороне клиента, это не просто пара строк, как это было бы с сервисом node.js.

Самый простой способ, который я могу придумать на данный момент, - это использовать гиперссылку для загрузки нового файла:

//	source data
const data = [
  { "id": 1, "cols": [
    { "id": 1, "val": "row 1 col 1" },
    { "id": 2, "val": "row 1 col 2" },
    { "id": 3, "val": "row 1 col 3" },
    { "id": 4, "val": "row 1 col 4" },
    { "id": 5, "val": "row 1 col 5" }
  ]},
  { "id": 2, "cols": [
    { "id": 6, "val": "row 2 col 1" },
    { "id": 7, "val": "row 2 col 2" },
    { "id": 8, "val": "row 2 col 3" },
    { "id": 9, "val": "row 2 col 4" },
    { "id": 10, "val": "row 2 col 5" }
  ]},
  { "id": 3, "cols": [
    { "id": 11, "val": "row 3 col 1" },
    { "id": 12, "val": "row 3 col 2" },
    { "id": 13, "val": "row 3 col 3" },
    { "id": 14, "val": "row 3 col 4" },
    { "id": 15, "val": "row 3 col 5" }
  ]}
];
// create a new dataset by rmoving the 3rd row
const removed_row = data.filter( row => row.id !== 3 );
// create a uri for the object
const data_uri = "data:text/json;charset=utf-8," + encodeURIComponent( JSON.stringify( removed_row ));
const data_name = "myJSON";
// create a hyperlink we can click to download the file
const anchor = document.createElement( 'a' );
anchor.href = data_uri;
anchor.download = `${ data_name }.json`;
// append, click and remove the anchor so the download is triggered
document.body.appendChild( anchor );
anchor.click();
anchor.remove();

Одним из недостатков является то, что вы будете ограничены в размере файла. Как только вы превысите определенный лимит, это больше не будет работать. Если вам нужны большие файлы JSON размером в несколько мегабайт, вам, вероятно, лучше поискать серверное решение.

Другие вопросы по теме