Изменять заголовок формы в зависимости от id кнопки

Question

Есть одна форма на сайте, необходимо изменять заголовок формы в зависимости от id кнопки, по которому оно было вызвано.

<button id="call">Заказать звонок</button>
<!-- Вызывается  форма с заголовком "Заказать звонок"-->
<button id="order">Оформить доставку</button>
<!-- Вызывается  форма с заголовком "Оформить доставку"-->

и т.д.

Вот, что у меня получилось найти, но код не работает

var buttonModal = document.getElementsByClassName("btn-primary");
var titleModal = document.getElementsByClassName("modal-title");

buttonModal.addEventListener("click", function (e) {
  for (var element of buttonModal) {
    if (document.getElementById("order") != null) {
      titleModal.innerHTML = "Оформить доставку";
    }
    if (document.getElementById("call") != null) {
      titleModal.innerHTML = "Заказать звонок";
    }
  }
});

Answer 1

Обратите внимание, что вы получаете массив элементов. Для каждой кнопки нужно добавить слушатель событий.

buttonModal.forEach(item => item.addEventListener("click", function (e) {
  let target = e.target; # Содержит элемент по которому кликнули;
  if (target.id === 'call') titleModal.forEach(item => item.innerHTML = "Оформить доставку");
  else titleModal.forEach(item => item.innerHTML = "Заказать звонок");
}));

Answer 2

Благодаря ответу Даня я решил свою проблему. Вот код:

var buttonModal = document.querySelectorAll(".btn-primary");
var titleModal = document.querySelector(".modal-title");

buttonModal.forEach((button) => {
  if (document.querySelector("#call") != null) {
    document.querySelectorAll("#call").forEach(function(el){
        el.addEventListener("click", function (e) {
            titleModal.innerHTML = "Заказать звонок";
        });
    });
    
  }
  if (document.querySelector("#order") != null) {
    document.querySelectorAll("#order").forEach(function(el){
        el.addEventListener("click", function (e) {
            titleModal.innerHTML = "Оформить доставку";
        });
    });
    
  }

БЛОГ НА HUSL

Изменять заголовок формы в зависимости от id кнопки

Ответы (2 шт):