Jquery добавление/удаление строк html + массивов JSON ⇐ Jquery

[Anonymous]

Я пытаюсь создать систему, в которой пользователь может добавлять или удалять строки во временную таблицу, чтобы он мог редактировать «таблицу» JSON, которая будет отправлена ​​через AJAX, чтобы получить некоторые результаты запроса (еще не разобрался с этим). Я «нажимаю» каждую введенную строку, чтобы добавить ее как новый массив, обновляю таблицу, чтобы включить ее, а затем удаляю записи, «объединяя» массив с соответствующим идентификатором, и снова обновляю таблицу. Пока это выглядит примерно так:

Код: Выделить всё

let jsonString = '{"arrays":[]}';

$(".add-row").on("click", function(){

let obj=JSON.parse(jsonString);
obj['arrays'].push({"ID":var0,"field1":input1);
jsonString = JSON.stringify(obj);

let text = "";
for (let i in obj.arrays) {
text += " x "+ obj.arrays[i].field1 +"" }
document.getElementById("table1").innerHTML = text;

$(".delete-row").on("click", function (){

let thisID = $(this).attr('value');
let obj = JSON.parse(jsonString);
let index = obj['arrays'].findIndex(function(item, i){
return item.ID === thisID
});
obj['arrays'].splice(index,1);
jsonString = JSON.stringify(obj);
let text = "";
text += " x "+ obj.arrays[i].field1 +"" }
document.getElementById("table1").innerHTML = text;
});
});

Моя проблема в том, что это, похоже, в основном работает, за исключением того, что, хотя вы можете добавить несколько строк, вы можете удалить только одну строку, если не добавите еще одну. Я уверен, что то, как я с этим справился, в целом далеко не идеально, поскольку это моя первая попытка работы с JSON, и я занимаюсь этим только в качестве хобби. Я уверен, что это как-то связано с тем фактом, что строка удаления вложена в строку добавления, но это вообще не работает, если они являются братьями и сестрами. Нужно ли мне вместо этого запускать его как своего рода прослушиватель событий? Как вы думаете, оно вообще может работать в таком формате? Вы в ужасе и рекомендуете мне поступить иначе? Я изучил .append, но не понимаю, как заставить его работать с JSON.
(Я также не уверен, почему это работает, только если некоторые части отформатированы в JQuery, а другие - в обычном JS; если я попытаюсь поменять местами какие-либо части между ними, это вызовет негодование).

Подробнее здесь: https://stackoverflow.com/questions/798 ... son-arrays