$ ("#submitButton") .submit (function (e) {});JQuery не работает

Question

Я провел все утро, пытаясь понять, почему мой $ ("# submitButton"). Submit (function () {}); не работает.

У меня есть форма, которая имеет 2 тега:

(input type = "password") для пользователя, чтобы ввести свой пароль еще раз, прежде чем нажать submitButton.

И (кнопка type = "submit") как кнопка для отправки формы

<div class="card p-2">
   <form>
      <div class="input-group">
          <label for="inputPasswordAgain" class="sr-only">Password</label>
          <input type="password" id="inputPasswordAgain" class="form-control" placeholder="Please enter your password again!" required>

          <div class="input-group-append">
              <button type="submit" id="submitButton" name ="submitButton" class="btn btn-secondary btn-block">Submit Changes</button>
          </div>
       </div>
   </form>
</div>

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

Поскольку кнопка «Удалить» в таблице является формой, у меня не может быть вложенной формы для отправки того, что пользователь выбирает для каждого раскрывающегося списка выбора в каждой строке.

THUS, я создал AJAX jquery для выбора значений из всех выпадающих списков и передачи их в updateViewing-helper.php.

<script type="text/javascript">
        $( document ).ready(function() {
            $( "#submitButton" ).click(function() {
                var data = {};
                var i;
                for (i = 0; i < $("#sessionQuantity").html(); i++) {
                    data[i] = $("#" + i).val();
                };
                $.ajax({
                    type: "POST",
                    url: "updateViewing-helper.php",
                    data: data,
                    success: function{blah blah blah}
                    }
                });
            });
        }); 
  </script>

Все работает нормально, за исключением того, что я использую .click (function () {}), но это вызовет updateViewing.php без отправки формы выше (один с тегом ввода и тегом кнопки, иначе пользователь может пропустить ввод своего пароля в и просто нажмите на кнопку).

Итак, я попытался использовать .submit (function () {}), затем использовать e.preventDefault (), чтобы предотвратить фактическую отправку из формы, затем передать все выпадающие списки в AJAX, а затем вызвать помощник updateViewing. php через AJAX, затем я могу проверить соответствие пароля в php-файле updateViewing-helper.

$( document ).ready(function() {
            $( "#submitButton" ).submit(function(e) {
                alert( "form submitted" );
                e.preventDefault();

                var data = {};
                var i; blah blah the code is the same as before

НО .submit не работает !!! нет всплывающих окон или чего-либо еще. Любое предложение приветствуется!

Answer 1

Звоните, отправляйте на форму, а не на кнопку

Сначала дайте идентификатор для формы

<form id="myForm">

Тогда позвоните отправить по этому номеру

$( document ).ready(function() {
   $("#myForm").submit(function(){

    });
});