Question

我有一个用于发送4字段消息的引导模式形式。按下提交按钮后，我想向用户显示一个＆＃34;谢谢你＆＃34;信息。但不是说我的表格正在关闭，页面令人耳目一新。

如何使模式表单保持打开状态，以便在提交按钮下方显示消息。

谢谢！

      <section class="modal-form">
  <!-- Modal Video first page -->
  <div class="modal fade" id="participa-modal" tabindex="-1" role="dialog" aria-labelledby="participa-modal">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title" id="myModalLabel">Participă la un demo!</h4>
        </div>
        <div class="modal-body">
          <div class="form-group">
            <form id="form" method="post" class="contact" action="" enctype="multipart/form-data" data-parsley-validate>
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group">
                      <input type="text" name="homepage_firstname" id="homepage_firstname" class="form-control-contact" placeholder="Nume" required>
                    </div>
                    <div class="form-group">
                      <input type="email" name="homepage_email" id="homepage_email" class="form-control-contact" placeholder="Email" required>
                    </div>
                    <div class="form-group">
                      <input type="text" name="homepage_phone" id="homepage_phone" class="form-control-contact" placeholder="Telefon" data-parsley-type="number" minlength="10" maxlength="10" required>
                      <input type="hidden" name="inner_message" id="inner_message" value="Participare demo curs!">
                    </div>
                  </div>
                  <div class="col-md-6">
                    <div class="form-group">
                      <textarea class="form-control-contact" name="homepage_message" id="homepage_message" placeholder="Scrisoare de intentie"></textarea>
                    </div>
                  </div>
                </div>
                <div class="form-actions">
                    <input type="hidden" name="homepagesubmitted" value="TRUE" />
                    <button type="submit" class="btn orange sign-in-btn">Înscrie-te</button>
                </div>
                <?php echo $homepage_send ?>
              </form>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- End Modal Video first page -->
  </section>

更新：好。因此，我设法使其运行以下代码$(function () { var frm = $('#participa-modal'); frm.submit(function (ev) { $.ajax({ type: frm.attr('method'), url: frm.attr('action'), data: frm.serialize(), success: function (data) { alert('ok'); location.reload(); } }); ev.preventDefault(); }); });

排队是如何在SEND按钮下的同一弹出窗口中替换警报（＆＃39; ok＆＃39;）指向谢谢。

Answer 1

$(".modal-body form").submit(function(e) {
    var url = "ActionScript.php"; // the script where you handle the form input.
    $.ajax({
           type: "POST",
           url: url,
           data: $(this).serialize(), // serializes the form's elements.
           success: function(data) {
               $(this).html("Thank you!!!");
           }
         });
    e.preventDefault(); // avoid to execute the actual submit of the form.
});

检查上述代码以了解您的要求

使用的条款

$(".modal-body form")课程和子表单选择器，以便定位您提交form

.submit(触发表单submit上的活动

type: "POST"用于通过方法发布

安全遍历数据

.serialize()是收集（汇编）并发送发布数据

success:是一个回调，以便在提交成功时继续。

表单提交和页面刷新后，Bootstrap模式保持打开状态

1 个答案: