Как сделать запрос на сервер в форме которая находится в popup?

Question

[Валентин Попов]

Здравствуйте.
Подскажите пожалуйста пытаюсь данные отправить на сервер через форму которая находится в popup окне.

Если форма не в popup окне, то запрос выполняется успешно, а если форма в popup окне, то не работает.
вот сам запрос на js

document.addEventListener('DOMContentLoaded', () => {

	const ajaxSend = async (formData) => {
		const fetchResp = await fetch('https://site.com/local/create_lead.php', {
			method: 'POST',
			mode: 'no-cors',
			cache: 'no-cache',
			credentials: 'same-origin',
			headers: {
				'Content-Type': 'application/json'
			},
			redirect: 'follow',
			referrerPolicy: 'no-referrer',
			body: formData
		});
		if (!fetchResp.ok) {
			throw new Error(`Ошибка по адресу ${fetchResp.url}, статус ошибки ${fetchResp.status}`);
		}
		return await fetchResp.text();
	};

	const forms = document.querySelectorAll('form');
	forms.forEach(form => {
		form.addEventListener('submit', function (e) {
			e.preventDefault();
			const formData = new FormData(this);

			ajaxSend(formData)
				.then((response) => {
					form.reset();
				})
				.catch((err) => console.error(err))
		});
	});

});

Comments

[VegasChickiChicki]

У вас попап создается динамически? Выведете в консоль forms, что там лежит, есть ли там форма которая находится в попапе?

Answer 1

[Radiks Alijevs]

Здравствуйте!

Похоже на то, что самой формы нет в DOM, при загрузке страницы и когда открыт попап js не знает о том, что в DOM появилась новая форма и js не срабатывает. Можно затестить так, инициализируйте вашу функцию во время открытия попапа, если проблема в этом, форма будет срабатывать.

const forms = document.querySelectorAll('form');
  forms.forEach(form => {
    form.addEventListener('submit', function (e) {
      e.preventDefault();
      const formData = new FormData(this);

      ajaxSend(formData)
        .then((response) => {
          form.reset();
        })
        .catch((err) => console.error(err))
    });
  });

Comments

[ThunderCat]

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

[Radiks Alijevs]

Обновил