Как отработать форму при нажатии на Enter?

Question

[Danya Wyse]

Как отправлять сообщение с инпута при нажатии на Enter и чтобы не обновлялась страница?

https://iwyse.github.io/ChatBot/

Comments

[serhiops]

ну просто callback функции определи..

Answer 1

[stavfz]

Отправил тебе pull request исправил три строчки
в app.js
217 и 224

217 const sendMessage = document.querySelector(".chat__input"); //так будем отслеживать события всей формы а не только кнопки
224 sendMessage.addEventListener("submit", (function(e) { // Обрабатываем события формы submit оно наступает в частности при нажатии на enter если курсор стоит в одном из  input-ов формы

и в фалйе index.html
Меняем тип кнопки на submit чтобы при нажатии на неё генерировалось событие отправки которое обработается в app как и раньше обрабатывался клик по этой кнопке

39 <button type="submit" class="send-message"><img class="send-icon" src="img/send.svg" alt="icon send message"></button>

app.min.js тоже перегенирировал с учетом внесённых изменений.

Comments

[Danya Wyse]

Сделал все, но обновлялась страница при любом способе отправки формы
Добавил отмену действий по умолчанию и все заработало

sendMessage.addEventListener("submit", function (e) {
  e.preventDefault();
}

[Danya Wyse]

Больше спасибо за такой развернутый ответ :)