Ajax Форма отправки Дважды

Question

У меня есть форма в модальном окне, которая позволяет пользователю повторно отправить подтверждение по электронной почте. Когда форма отправлена, письмо с подтверждением отправляется дважды, а не один раз. Все остальное работает точно так, как должно.

Форма довольно стандартная:

<form enctype="multipart/form-data" id="ReMailf" name="ReMailf" role="form" data-toggle="validator">
<fieldset>
<div class="row">
<p>You may enter a different email than your original if you wish. However, the original email will remain as the main contact on your application.</p>
<label class="desc" for="prim_email"> Email </label>
<input id="prim_email" name="prim_email" type="email" class="form-control" value="<?php echo $tE['prim_email']; ?>" data-error="Please Enter A Valid Email Address" required/>
<div class="help-block with-errors"></div>
</div>
<div class="row">
<input id="submitForm" name="submitForm" class="btn btn-success" type="submit" value="Resend Conformation "/>
<input name="uniqid" type="hidden" value="<?php echo $tE['unqID']; ?>"/>
<input name="ReMAIL" type="hidden" value="ReMAIL"/>
</div>
</fieldset>
</form>

… и вот обработчик:

$(document).ready(function () {
    $("#ReMailf").on("submit", function(e) {
        var postData = $(this).serializeArray();
        // var formURL = $(this).attr("action");
        $.ajax({
            url: '_remail.php',
            type: "POST",
            data: postData,
            success: function(data, textStatus, jqXHR) {
                $('#myModal .modal-header .modal-title').html("YOUR EMAIL HAS BEEN RESENT");
                $('#myModal .modal-body').html(data);
                // $("#ReMailf").remove();
            },
            error: function(jqXHR, status, error) {
            console.log(status + ": " + error);
            }
        });
        e.preventDefault();
    });

    $("#submitForm").on('click', function() {
        $("#ReMailf").submit();
    });

});

Я прочитал ряд других постов по этому поводу и попробовал некоторые из предложений, но ничего не работает. Он либо не отправляется вообще, либо отправляется дважды. Это единственная форма на странице ...

Предложения, пожалуйста?

Answer 1

Это потому, что вы используете кнопку или кнопку отправки для запуска события AJAX. Используйте это вместо:

$(document).ready(function() {
      $("#ReMailf").on("submit", function(e) {
            e.preventDefault(); //add this line
            var postData = $(this).serializeArray();
            // var formURL = $(this).attr("action");
            $.ajax({
                  url: '_remail.php',
                  type: "POST",
                  data: postData,
                  success: function(data, textStatus, jqXHR) {
                    $('#myModal .modal-header .modal-title').html("YOUR EMAIL HAS BEEN RESENT");
                    $('#myModal .modal-body').html(data);
                    // $("#ReMailf").remove();
                  },
                  error: function(jqXHR, status, error) {
                    console.log(status + ": " + error);
                  }

или вы можете просто использовать простую форму с действием и методом. Это сделает работу