Как обновить содержимое таблицы с помощью js?

Question

[Евгений]

Имеется обычная таблица которая заполняется через foreach.

@foreach($parsers as $parser)
                    <tr>
                        <td scope="row" >{{ $parser->id }}</dh>
                        <td >{{$parser->url}}</td>
                        <td >{{ $parser->is_active }}</td>
                        <td >{{ $parser->publish }}</td>
                        <td><button type="button" id="btnEdit" class="btn btn-info"  data-toggle="modal" data-target="#exampleModal" value="{{ $parser->id }}">Редактировать</button></td>
                    </tr>
                @endforeach

Мне необходимо сделать так что бы при редактировании какого-то столбца обновлялась информация всей таблицы или конкретного поля.

success: function(jsonData){
                    $.each(jsonData, function(key, value){
                
                        $('#table_id').html(value.id); //таким образом заполняется таблица последним элементом коллекции 
                        $('#table_url').html(value.url);              
                    });
                },

Не могу разобраться как это реализовать. Может стоит использовать другой подход?

Comments

[Станислав]

Ну как бы после ответа сервера банально берете и обновляете новым содержимым нужный DOM, а чтобы не было каши можно инициализировать tr
<tr data-id="12345">
Ищите данный элемент и заменяете все нужные поля

Answer 1

[xmoonlight]

Данные - всегда храните в JSON.
Получили JSON -> визуализировали как таблицу.
Отредактировали поле -> Обновили/пересчитали поле внутри JSON-структуры и с него же обновили визуализацию, и отправили готовый JSON на сервер (если необходимо) или его часть (только новые данные).