Sweet Alert работает только на первую кнопку, почему?

Question

[password22]

Купили готовый интернет-магазин на cms Diafan, в шаблоне при покупке товара никак не показывается, что товар положен в корзину. Подключил sweet alert 2, но он срабатывает только на одну кнопку. В js вообще не силен, подскажите пожалуйста, как сделать всплывающее окно на все кнопки в карточках товаров?

var button = document.getElementsByClassName("btn")[0];
	button.addEventListener('click', function() {
		Swal.fire({
	  title: 'Вы добавили в корзину',
	  text: "столько-то там товара",
	  type: 'warning',
	  	showCancelButton: true,
	  	cancelButtonText: "Перейти в корзину",

	  backdrop: "linear-gradient(yellow, orange)",
	  confirmButtonColor: '#fdbc04',
	  cancelButtonColor: '#fdbc04',

	  	confirmButtonText: 'Продолжить покупки'
	}).then((result) => {
	  if (result.value) {
	    Swal.fire('Товар','Успешно добавлен в корзину!','success')}
        else {
            window.location.href = "http://.....";
        }
	})
	});

Answer 1

[lamer350]

Потому что событие вешается только на первую кнопку в коде:

var button = document.getElementsByClassName("btn")[0];

Ответ найдете тут
Необходимо событие повесить на все кнопки через цикл

Comments

[password22]

Вы не могли бы пожалуйста объяснить подробнее? Английского не знаю, с переводчиком ничего не понятно, с js не дружу :)

Answer 2

[Евгений]

Нужно уведомление вешать не на кнопку добавления в корзину, а на успешный ответ от сервера на добавление товара в корзину