@pavuuuk

Как сделать форму, которая будет появляться при нажатии кнопки войти?

Я на самом деле уже сделал такую форму, но есть проблема. Я её понимаю так:
Сервер у меня на express.js. В качестве страниц рендерятся шаблоны pug. При нажатии на главной странице кнопку "войти" js код который ПРИВЯЗАН к главной странице отправляет данные на сервер с помощью fetch(потому что я не знаю, как это сделать по другому, ведь мне нужно получить ответ от сервера назад, а ajax я незнаю). Сервер отправляет файл html с формой. И когда приходят данные клиенту они читаются, как res.text() и загружаются, как html в самое начало страницы. Стили, привязанные к главной странице, применяются к форме сразу, а вот с js кодом проблемы. Fetch ведь асинхронный метод и срабатывает после js кода, поэтому событие submit, которое должно слушаться формой не слушается. Как навесить событие на форму, которая загружается с сервера ассинхронно.

И вообще правильно ли я делаю? В интернет очень сложно найти такие формы, но используются они везде. Может быть нужно отправлять данные как-то по другому? Пожалуйста расскажите как, если знаете. Кода, к сожалению, нет, т.к. я расстроился и переделал форму, как отдельную страницу.
  • Вопрос задан
  • 142 просмотра
Решения вопроса 1
@myaca
1. fetch и есть ajax
2. > Как навесить событие на форму, которая загружается с сервера ассинхронно. - нужно вешать прослушку событий на элемент, в который эта форма прилетает, т.е.
<div id="with-form">
    <form .../>
</div>

const form = document.getElementById('with-form');
form.addEventListener(...)


(Можешь погуглить в сторону "делегирование событий")

Это для решения которое ты хочешь.

А вообще такое поведение делается на клиентском javascript - делаешь форму с display:none, position: absolute
и по клику на, в твоем случае, "войти" - меняешь свойство display none -> block
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы