當提交按鈕在模態視窗中時，表單不起作用

我有 HTML 表單，里面有提交按鈕。在表單內部有一段 HTML 代碼，在填寫表單時會在模式視窗中彈出。在此模式中還有一個輸入和提交按鈕。而且它不起作用，表格不會發送到電子郵件。</form>但是當我在提交按鈕之前移動整個按鈕 HTML 代碼時。這是一個代碼：

<form name="autoForm" id="contact-form" class="row" method="post" action="php/send.php">
  <div class="form-group col-md-6">
    <label id="address-label" for="place">* Mark? | modelis | metai | TA | miestas</label>
    <input id="form_place" type="text" name="place" class="form-control" data-error="Laukas privalomas" >
    <div class="help-block with-errors"></div>
  </div>
  <div class="form-group col-md-12">
    <label for="message">Automobilio būkl?</label>
    <textarea id="form_message" name="message" class="form-control h-auto" rows="4" data-error="Pra?au, para?ykite daugiau apie NT" 
    placeholder="?ia galite para?yti daugiau informacijos apie automobilio būkl?"></textarea>
    <div class="help-block with-errors"></div>
  </div>
    <div class="submit-container col mt-5">
    <a class="btn btn-primary" id="to-modal-form"><font size="4">Su?inoti kain?</font></a>
  </div>
  
  <div id="modal-background" class="modal-background container-hidden">
    <div id="modal-form" class="modal-form">
      <a id="modal-close"><i class="icon-close" data-v-27b8b94e=""></i></a>
      <div class="form-header">
        <h2>Gaukite kainos pasiūlymus tiesiai ? savo telefon?.</h2>
        <p>?veskite telefono numer? ir gaukite pasiūlymo nuorod? <b>SMS</b></p>
      </div>
      <div class="form-body">
      <div class="form-group col-md-6">
        <label class="phone" for="phone">* Jūs? telefono numeris</label>
        <input id="form_phone" type="phone" name="phone" class="form-control" required="required" data-error="Laukas privalomas">
        <div class="help-block with-errors"></div>
      </div>
      <input type="hidden" name="code" value="" id="code" />
      <button class="btn btn-primary" type="submit" id="form_submit"><font size="4">T?sti</font></button>
      <span class="privacy">Sutinku su <a href="">privatumo politika</a></span>
    </div>
  </div>
</form>

填寫第一個輸入有第一個按鈕<a id="to-modal-form"><font size="4">Su?inoti kain?</font></a>，它正在打開模式視窗。在填充額外的輸入后，我按下<button type="submit" id="form_submit"><font size="4">T?sti</font></button>哪個不起作用。但是之前移動按鈕時表單作業</form>。表單發送所有值 - 模式視窗內外。無法得到什么是錯的。

uj5u.com熱心網友回復：

如果您在外面有按鈕</form>，它將不起作用，解決方案是使用form=""引數，button它基本上告訴它button屬于這個特定form元素

<button class="btn btn-primary" form="contact-form" type="submit" id="form_submit"><font size="4">T?sti</font></button>

uj5u.com熱心網友回復：

如果您將提交按鈕放在表單標簽之外，您的提交按鈕將會混淆它應該提交的表單。

您可以使用 javascript 提交表單。 https://www.javascript-coder.com/javascript-form/javascript-form-submit/

在你的模態框內放置一個按鈕onclick="submitForm('contact-form');"，然后添加下面的 js 代碼

function submitForm(id) {
     document.getElementById(id).submit();
}

uj5u.com熱心網友回復：

通過在屬性之前添加提交按鈕解決了這個問題hidden：

<form>
  <!-- the form content -->

  <button class="btn btn-primary" type="submit" id="form_submit"  hidden></button>
</form>

模態視窗內的那個按鈕作為觸發器，具有onclick="submitForm();"如下屬性：

<button class="btn btn-primary" onclick="submitForm();"><font size="4">T?sti</font></button>

在 JS 中，它使用以下方法觸發提交按鈕.click()：

const submitBtn = document.getElementById('form_submit');

function submitForm() {
  submitBtn.click();
}

標籤：html 形式

上一篇：如何使用javascript在帶有<td>元素的表中顯示當前月份的日期？

下一篇：使用Python Selenium在div中的類的div中選擇標簽？