Ajax отправить несколько раз

Question

Я создал приложение в php, я использую модель начальной загрузки для обновления пользовательских данных с помощью AJAX.Теперь есть две формы: сначала обновляет данные пользователя и добавляет комментарии другому пользователю.Когда я пытаюсь отправить форму в AJAX и пытаюсь отправить форму, она не работает, когда я использую функцию ajaxComplete, тогда данные моей формы были успешно отправлены, но в то время, когда она отправляет форму несколько раз одновременно.

$(document).ajaxComplete(function() {
      $("#add-remarks").on('submit', (function(e) {
        e.preventDefault();
        $.ajax({
          type: "POST",
          url: $("#add-remarks").attr("action"),
          cache: false,
          context: this,
          data: $("#add-remarks").serialize(), //only input
          success: function(data) {
            var obj = JSON.parse(data);
            $("#add-remarks")[0].reset();
            if (obj['msg'] == 'isuccess') {
              notification('insert');
            } else {
              notification('error');
            }
          }
        });
      }));

<div class="modal-body">
  <div class="row">
    <div class="col-md-12">
      <div class="card-group-control card-group-control-right" id="accordion-model">
        <div class="card">
          <form method="post" name="update-user-details" id="update-user-details" action="">
            <div class="row">
              <div class="col-md-4">
                <div class="form-group form-group-float">
                  <label class="d-block font-weight-semibold">First Name</label>
                  <input type="text" class="form-control" placeholder="First Name" name="customer_name" id="customer_name">
                </div>
              </div>
              <div class="col-md-4">
                <div class="form-group form-group-float">
                  <label class="d-block font-weight-semibold">Mobile</label>
                  <input type="text" class="form-control" placeholder="Mobile" name="mobile_number" id="mobile_number">
                </div>
              </div>
              <button type="submit" class="btn bg-blue">Save Changes</button>
            </div>
          </form>
          <form method="post" name="remarks" id="remarks" action="">
            <div class="row">
              <div class="col-md-4">
                <div class="form-group form-group-float">
                  <label class="d-block font-weight-semibold">Remarks</label>
                  <input type="text" class="form-control" placeholder="Remarks" name="remarks" id="remarks">
                </div>
              </div>
              <button type="submit" class="btn bg-blue">Save Changes</button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>

Answer 1

Переместите этот фрагмент кода за пределы функции ajaxComplete ().Возможно, вы как-то запускаете функцию ajaxComplete несколько раз, вызывая многократные прослушиватели событий для отправки формы.

 $("#add-remarks").on('submit', (function(e) {
    e.preventDefault();
    $.ajax({
      type: "POST",
      url: $("#add-remarks").attr("action"),
      cache: false,
      context: this,
      data: $("#add-remarks").serialize(), //only input
      success: function(data) {
        var obj = JSON.parse(data);
        $("#add-remarks")[0].reset();
        if (obj['msg'] == 'isuccess') {
          notification('insert');
        } else {
          notification('error');
        }
      }
    });
  }));