Всем доброго дня.
У меня на одной страничке есть форма, которая по сабмиту post-запросом в php пишет данные в бд, а затем с помощью ajax обновляет табличку, внося в неё новые данные, полученные в результате выполнения php кода.
Обновление происходит в таблице только внутри тега
И выглядит структура так:
<tr>
<input type="hidden" name="form_id" value="<?=htmlspecialchars($users['id'], ENT_QUOTES)?>">
<td><?=htmlspecialchars($users['item_name'], ENT_QUOTES)?></td>
<td><?=htmlspecialchars(round($users['quantity'], 2), ENT_QUOTES)?></td>
<td><button type="button" name="delete_item" id="item_delete" class="delete_btn"</button></td>
</tr>
Вот непосредственно код, который удаляет одну из строк, выбирая её по id:
$('button[id="item_delete"]').on('click', function() {
let $row = $(this).closest('tr');
let data = $row.find('input').serialize();
$.ajax({
type: "POST",
url: "delete_item.php",
data: data,
success: function(html){
$("#table_ajax").html(html);
$('#order')[0].reset();
}
});
return false;
});
Всё дело в том, что после обычной загрузки страницы или после обновления всё отрабатывает корректно - передаётся один id и удаляется конкретная строка, в которой была нажата кнопка.
А если я внёс данные в форму и ajax-ом обновил таблицу, то в php по нажатию кнопки передаются сразу все id из формы и удаляется, соответственно, только самый последний.
Кусок php кода, который выводит таблицу после завершения всех манипуляций с бд:
$message = '<tr>';
foreach ($user as $users) {
$message .= ' <input type="hidden" name="form_id" value="' . $users['id'] . '">
<td>' . $users['item_name'] . '</td>
<td>' . $users['quantity'] . '</td>
<td><button type="submit" name="delete_item" id="item_delete" class="delete_btn" value="' . $users['id'] . '" ></button></td>
</tr>';
}
echo $message;
Я понимаю, что я где-то что-то упустил, но не понимаю, что именно.
