Можете ли вы подключить информационную форму к другой форме на странице?

Question

Я новичок в HTML, CSS и Javascript. Все еще учусь работать с ними для создания динамических форм.

Я разрабатываю группу форм на веб-странице. Я хотел бы иметь небольшую информационную форму, которая связана или скопирована с другими формами на странице, когда они отправляются.

Например, человек, собирающий форму, наблюдает за командой из 3 человек, выполняющих действия. Сборщик данных должен иметь возможность заполнять общую информацию о том, когда они собирают данные наблюдений, и некоторые особенности окружающей среды. Они также должны иметь возможность заполнять ряд параллельных «рабочих» форм, которые можно отправлять, а затем перезагружать для создания нового экземпляра для этого работника. Таким образом, сборщик данных может регистрировать неизвестное количество экземпляров действий для каждого отдельного члена команды. Форма общей информации должна быть прикреплена к каждой форме экземпляра активности работника в одной строке данных (переменные информации формы + переменные экземпляра активности работника = одна строка данных).

Это будет похоже на приведенный ниже набор форм:

<form id="info" action="post-to-a-google-sheet" method="get">
<fieldset>
<legend>Form Information:</legend>
  <label for="initials"><strong>Initials:</strong></label> 
    <input name="initials" required size="3" type="text" pattern="[A-Za-z]{3}" placeholder="ABC"/>
  <label for="form_date"><strong>Date:</strong></label><input name="form_date" id="form_date" required type="date"/>
  <label for="start_time"><strong>Start Time:</strong></label>
    <input name="start_time" id="start_time" required type="time"/>
   <label for="end_time"><strong>End Time:</strong></label><input name="end_time" id="end_time" required type="time" /><br><br>
<button id="submit-info" type="submit">Submit Info</button><br><br>
</fieldset>
</form>

<form id="Worker" action="post-to-a-google-sheet" method="get">
<fieldset>
 <legend>Worker 1:</legend>
  <label for="WorkerType">Type:</label>
    <select name="WorkerType">
      <option>Select</option>
      <option value="1">Type 1</option>
      <option value="2">Type 2</option>
      <option value="3">Type 3</option>
     </select>
  <label for="min">Minutes:</label> 
   <input name="min" id="min" type="radio" value="1" /> &lt;5 
   <input name="min" id="min" type="radio" value="2" /> 5-10 
   <input name="min" id="min" type="radio" value="3" /> &gt;10
  <label for="completed">Completed:</label>
   <input name="completed" id="completed" type="checkbox" value="1" /><br><br>
<button id="submit-worker1" type="submit">Submit Worker 1</button><br><br>
</fieldset>
</form>
<form id="Worker" action="post-to-a-google-sheet" method="get">
<fieldset>
 <legend>Worker 2:</legend>
  <label for="WorkerType">Type:</label>
    <select name="WorkerType">
      <option>Select</option>
      <option value="1">Type 1</option>
      <option value="2">Type 2</option>
      <option value="3">Type 3</option>
     </select>
  <label for="min">Minutes:</label> 
   <input name="min" id="min" type="radio" value="1" /> &lt;5 
   <input name="min" id="min" type="radio" value="2" /> 5-10 
   <input name="min" id="min" type="radio" value="3" /> &gt;10
  <label for="completed">Completed:</label>
   <input name="completed" id="completed" type="checkbox" value="1" /><br><br>
<button id="submit-worker2" type="submit">Submit Worker 2</button><br><br>
</fieldset>
</form>

<form id="Worker" action="post-to-a-google-sheet" method="get">
<fieldset>
 <legend>Worker 3:</legend>
  <label for="WorkerType">Type:</label>
    <select name="WorkerType">
      <option>Select</option>
      <option value="1">Type 1</option>
      <option value="2">Type 2</option>
      <option value="3">Type 3</option>
     </select>
  <label for="min">Minutes:</label> 
   <input name="min" id="min" type="radio" value="1" /> &lt;5 
   <input name="min" id="min" type="radio" value="2" /> 5-10 
   <input name="min" id="min" type="radio" value="3" /> &gt;10
  <label for="completed">Completed:</label>
   <input name="completed" id="completed" type="checkbox" value="1" /><br><br>
<button id="submit-worker3" type="submit">Submit Worker 3</button><br><br>
</fieldset>
</form>