jQuery: форма не отправляется с $ ("# id"). submit (), но будет отправлена ​​с кнопкой "submit"? - PullRequest
Новая
       2

jQuery: форма не отправляется с $ ("# id"). submit (), но будет отправлена ​​с кнопкой "submit"?

37 голосов
/ 22 июля 2010 
<form method="post" action="load_statements.php?action=load" id="loadForm"
                            enctype="multipart/form-data">

это моя форма, которая мне подходит.в этой форме я помещаю эту кнопку: 

<input type="button" name="submit" id="submit" value="Submit" onclick="confirmSubmit()" class="smallGreenButton" />

вот функция, которую она вызывает: 

function confirmSubmit() {
    // get the number of statements that are matched
    $.post(
        "load_statements.php?action=checkForReplace",
        {
            statementType : $("#statementType").val(),
            year : $("#year").val()
        },
        function(data) {
            if(data['alreadyExists']) {
                if( confirm("Statements already exist for " + $("#statementType").html() + " " + $("#year").val() +
                    ". Are you sure you want to load more statements with these settings? (Note: All duplicate files will be replaced)"
                )) {
                    $("#loadForm").submit();
                }
            } else {
                $("#loadForm").submit();
            }
        }, "json"
    );
}

и, как вы можете видеть, она вызывает $("#loadForm").submit();, но формане отправляется (т. е. страница не обновляется).почему это так?

спасибо!

Ответы [ 8 ]

76 голосов
/ 05 января 2013

Измените имя кнопки «отправить» на другое. Это вызывает проблему. Смотрите ответ Дениса на: http://forum.jquery.com/topic/submiting-a-form-programmatically-not-working

См. Документацию jQuery submit ():

Формы и их дочерние элементы не должны использовать входные имена или идентификаторы, которые конфликт со свойствами формы, такими как submit, length или method. Конфликты имен могут привести к сбивающим с толку ошибкам. Для полного списка правила и проверить вашу разметку для этих проблем, см. DOMLint.

19 голосов
/ 27 февраля 2013

Я использую $("form")[0].submit()

здесь $("form") возвращает массив элементов DOM, поэтому, получив доступ к соответствующему индексу, мы можем получить объект DOM для элемента формы и выполнить функцию submit() внутри этого элемента DOM.

Откат - если у вас есть несколько элементов формы на одной html-странице, вы должны иметь представление о правильном порядке «формы» s

17 голосов
/ 22 июля 2010

http://api.jquery.com/submit/

Событие jQuery submit() добавляет прослушиватель событий, который происходит при отправке формы.Таким образом, ваш код практически ничего не связывает с событием submit. Если вы хотите, чтобы эта форма была отправлена, вы используете old-school JavaScript document.formName.submit().

Я оставляю свой оригинальный ответ выше, чтобы указать, где я был.Что я имел в виду , так это то, что если у вас есть такая функция, это сбивает с толку, почему вы должны публиковать значения в части ajax, а затем использовать jQuery для отправки формы.В этом случае я бы связал событие с нажатием кнопки, а затем возвратил бы true, если вы хотите, чтобы он возвратил, в противном случае верните false, например так: 

$('#submit').click( function() {
  // ajax logic to test for what you want
  if (ajaxtrue) { return confirm(whatever); } else { return true;}
});

Если эта функция возвращает true,тогда это считается как успешное нажатие кнопки отправки, и происходит нормальное поведение браузера.Затем вы также отделили логику от разметки в форме обработчика событий.

Надеюсь, это имеет больше смысла.

13 голосов
/ 04 декабря 2014

У меня была похожая проблема, потребовалось время, чтобы разобраться.Функция jQuery .submit () должна инициировать отправку формы, если вы не передаете ей обработчик, но причина этого заключается в том, что ваша кнопка отправки называется «submit» и переопределяет функцию отправки формы.

т.е. jQuery вызывает функцию <form>.submit() объекта DOM, но ко всем входам в форме можно также получить доступ, вызвав <form>.<inputname>.Так что, если один из ваших входных данных называется 'submit', он переопределяет функцию <form>.submit(), а <form>.submit - элемент ввода DOM .... если это имеет смысл?Поэтому, когда jQuery вызывает <form>.submit(), это не работает, потому что submit больше не является функцией. Итак, если вы измените имя своей кнопки, она должна работать.

Не уверен, почему консоль не регистрирует ошибку, возможно, jQuery сначала проверяет, существует ли функция отправки и работает ли онапросто игнорируем запрос, если функция не существует.

4 голосов
/ 22 июля 2010

я добавил в форму невидимую кнопку отправки, и вместо вызова функции submit () я вызываю функцию click () для кнопки отправки =)

кнопка: <div style="display:none"><input id="alternateSubmit" type="submit" /></div>

безумный способ обойти форму представления: $("#alternateSubmit").click();

3 голосов
/ 07 сентября 2016

сотрите атрибут "name" в кнопке отправки:

это ваш код: 

<input type="button" name="submit" id="submit" value="Submit" onclick="confirmSubmit()" class="smallGreenButton" />

должно быть так: 

<input type="button" id="submit" value="Submit" onclick="confirmSubmit()" class="smallGreenButton" />
0 голосов
/ 22 июля 2010

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

window.location.href = "/somewhere/else";
0 голосов
/ 22 июля 2010

Похоже, что отправка происходит в обратном вызове, который запускается только после сообщения ajax в обработчике onclick.

Другими словами, когда вы нажимаете Отправить, браузер должен сначала выйти и нажатьдействие checkForReplace.

...