Для обработки кликов по кнопкам, которые были созданы динамически на странице с использованием технологии AJAX, можно использовать делегирование событий. Для этого можно добавить обработчик события клика на родительский элемент, который существует на момент загрузки страницы, и внутри этого обработчика проверять, по какой конкретно кнопке был совершен клик.
Вот пример кода, который показывает как это можно реализовать:
```html
<div id="container">
<!-- Динамически созданные кнопки -->
</div>
```
```javascript
document.getElementById('container').addEventListener('click', function(event) {
if (event.target && event.target.nodeName === 'BUTTON') {
// Обработка клика по кнопке
// Можно добавить код для отправки AJAX запроса
}
});
```
Чтобы исправить проблему с ajax-запросом и JavaScript, если при повторном нажатии кнопок "Добавить" -- "Удалить", функционал перестает работать, вам может помочь правильное управление состоянием кнопок.
Вот пример кода, который показывает как можно исправить проблему:
```html
<button class="addButton">Добавить</button>
<button class="deleteButton">Удалить</button>
```
```javascript
document.querySelector('.addButton').addEventListener('click', function() {
// Код для добавления товара
// Можно добавить AJAX запрос для добавления товара
// После успешного добавления товара изменить состояние кнопок
document.querySelector('.addButton').disabled = true;
document.querySelector('.deleteButton').disabled = false;
});
document.querySelector('.deleteButton').addEventListener('click', function() {
// Код для удаления товара
// Можно добавить AJAX запрос для удаления товара
// После успешного удаления товара изменить состояние кнопок
document.querySelector('.addButton').disabled = false;
document.querySelector('.deleteButton').disabled = true;
});
```
Этот код следит за состоянием кнопок и изменяет их доступность в зависимости от действий пользователя. Надеюсь, это поможет вам исправить проблему с вашим кодом.