提交带有Sweetalert的表单而无需刷新

时间:2018-08-19 00:28:44

标签: javascript sweetalert

您好,我正在使用此SweetAlert

Sweetalert

下面有我的HTML和JS。我想做的是提交表单,但在刷新/重定向到PHP时停止。我只希望它运行,发送数据,触发sweetalert消息并停止(请稍等提交后清除表单上的数据,但现在我需要停止它)。

HTML

<div class="container">
      <form id="contact-form" action="php/contactform.php" method="post">
        <div class="form-group">
          <label for="exampleInputEmail1">Full Name</label>
          <input type="text" id="name" class="form-control" placeholder="Full name">
        </div>
        <div class="form-group">
          <label for="exampleInputEmail1">Email address</label>
          <input type="text" id="email" class="form-control" placeholder="Your e-mail">
        </div>
        <div class="form-group">
          <label for="subject">Subject</label>
          <input type="text" id="subject" class="form-control" placeholder="Subject">
        </div>
        <div class="form-group">
          <label for="description">Description</label>
          <textarea name="message" class="form-control" placeholder="Message"></textarea>
        </div>
          <button type="submit" class="btn btn-primary">
              Send
          </button>

      </form>
    </div>

JS

var form = document.getElementById('contact-form');

form.addEventListener('submit', submitForm);

function submitForm(e){
e.preventDefault();
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var subject = document.getElementById("subject").value;

var verifyEmail = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email);

if (name == "") {
    alert("Enter a name");
    return false;
} else if (email == "") {
    alert("Enter an email");
    return false;
}  else if (verifyEmail == false)
{
  alert("Enter valid email");
  return false;
}  else if (subject == "") {
    alert("Enter a subject line");
    return false;
}  

swal({
    title: "Email Sent!",
    text: "We will be contacting you shortly.",
    icon: "success",
    closeOnClickOutside: false,
    closeOnEsc: false
  })
  .then((isConfirm) => {
    if (isConfirm) {


        form.submit();

    } 
  });

  }

0 个答案:

没有答案