Проверить заполнен ли email в другой форме

Web Frontend: JavaScript, HTML/CSS
#1

Добрый день!
Такая задача.
Есть вот такая конструкция:
форма с двумя полями:

HTML5

<form name="textModal"> 
<input type="text" placeholder="E-mail" name="email" required> 
<textarea rows="5" type="text" placeholder="Shipping address" name="address"</textarea>
 </form>

есть кнопка, которая отправляет скрытые поля, нужно, чтобы вторая форма не отправлялась если в первой форме не заполнен email

HTML5

<form action="https://test.com" method="post" target="_blank">
<input type="hidden" name="charset" value="utf-8" />
<input type="hidden" name="lc" value=""> 
<input type="hidden" name="email" required>
<input type="hidden" name="item_name" value="">
<button type="submit">GO</button> 
</form>
#2

Странная задача :thinking:

А во второй форме откуда возьмется емаил? Наверно его надо JS заполнить, в onsubmit и т.п.
Ну и там же можно проверить заполненность.

#3

Суть в том, что на форме есть две кнопки и поле с email, которое не относится ни к одной из кнопок.
И нужно, чтобы ни одна из кнопок не срабатывала пока не будет заполнен email, а введённый email копировался в скрытые поля, которые находятся “под капотом” каждой из двух кнопок.
Понятно, что нужен какой-то скрипт, но какой и как это реализовать, не знаю… ((

#4

В коде выше одна кнопка.

А как это вообще работать должно? Если первая форма отправится, то страница же перезагрузится и форма очистится (если не ajax или фреймы).

#5

Есть форма, на которой есть строка ввода email и две кнопки: button1 и button2
в каждой кнопке прописаны скрытые поля, среди которых так же есть поле email
Нужно сделать так, чтобы при нажатии на любую из двух кнопок, делалась проверка на заполнение email из фомы выше и только при наличии заполненного адреса срабатывал код какой-то из двух кнопок (в зависимости на какую ткнули)

P.S. естественно после нажатия на любую кнопку и отправки формы страница перегружается.

#6

С помощью

Что-то типа такого

const form1 = document.querySelector('#form1')
const form2 = document.querySelector('#form2')

form2.onsubmit = function(e) {
  const email = form1.querySelector('input[name="email"]').value

  if (!email) {
    alert('Email is empty!')
    e.preventDefault()
    return
  }

  const hiddenEmailInput = form2.querySelector('input[name="email"]')
  hiddenEmailInput.value = email
}

<form id="form1" name="textModal">
  <input type="text" placeholder="E-mail" name="email" required>
  <textarea rows="5" type="text" placeholder="Shipping address" name="address"></textarea>
  <button type="submit">GO 1</button>
</form>

<form id="form2" action="https://test.com" method="post" target="_blank">
  <input type="hidden" name="charset" value="utf-8" />
  <input type="hidden" name="lc" value="">
  <input type="hidden" name="email" required>
  <input type="hidden" name="item_name" value="">
  <button type="submit">GO 2</button>
</form>

https://jsfiddle.net/AlexP11223/3z7ut8wq/19/

#7

спасибо большое. работает