Как отправить значения формы и получить ответ на этой же странице, или в popup окне

287

15 августа 2017, 12:37

У меня есть форма. После нажатия кнопки Submit я хочу что бы под формой появилась надпись что данные отправлены. Как мне это седлать при текущей разметки?

<form id="contact-form" method="post" action=""> 
  <input class="textbox" type="text" name="customerName" id="name" placeholder="Имя" /> 
  <input class="textbox" type="text" name="customerPhone" id="phone" placeholder="Телефон" /> 
  <input class="textbox" type="text" name="customerEmail" id="email" placeholder="Email" /> 
  <textarea class="textbox" name="customerRequest" id="message" placeholder="Комментарий" style="height: 25px;"></textarea> 
 
  <br /> 
 
  <div class="full-width"> 
    <input type="checkbox" />Я согласен с условиями политики конфиденциальности. <a href="#">Подробнее</a> 
  </div> 
 
  <br /> 
 
  <button class="button small-btn" type="submit" name="submit" id="submit">Отправить</button> 
 
  <br /><br /> 
 
  <p id="message-outcome"></p> 
</form>

Answer 1

<form id="contact-form" method="post" action="" "onsubmit=showMessage();">
  <input class="textbox" type="text" name="customerName" id="name" placeholder="Имя" />
  <input class="textbox" type="text" name="customerPhone" id="phone" placeholder="Телефон" />
  <input class="textbox" type="text" name="customerEmail" id="email" placeholder="Email" />
  <textarea class="textbox" name="customerRequest" id="message" placeholder="Комментарий" style="height: 25px;"></textarea>
  <br />
  <div class="full-width">
    <input type="checkbox" />Я согласен с условиями политики конфиденциальности. <a href="#">Подробнее</a>
  </div>
  <br />
  <button class="button small-btn" type="submit" name="submit" id="submit">Отправить</button>
  <br /><br />
  <p id="message-outcome" style="display:none;">Ваше сообщение отправлено!</p>
</form>
<script>
function showMessage() {
message = document.getElementById("message-outcome")
message.style.display = "block"
}
</script>

Это если вы хотите показывать информационное сообщение о том, что форма отправлена.