JQuery AJAX форма отправки не работает - PullRequest
Новая
       16

JQuery AJAX форма отправки не работает

2 голосов
/ 27 апреля 2010

Я пытаюсь отправить форму через AJAX вместо обычной отправки POST. HTML - это просто стандартная форма с method="post", и мой код jQuery выглядит следующим образом: 

jQuery.noConflict();
jQuery(document).ready( function($) {
    var $form = $('#default_contact');

    $form.submit( function() {
        $.ajax({
            type: 'POST',
            url: $form.attr( 'action' ),
            data: $form.serialize(),
            success: function( response ) {
                console.log( response );
            }
        });

        return false;
    });
});

(на основании этого ответа )

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

Ответы [ 3 ]

5 голосов
/ 27 апреля 2010

ваш код работает нормально, если html настроен правильно. Вот мой тестовый HTML (с PHP), так что вы можете сравнить с вашим собственным. 

<code><?php
if (!empty($_POST)) {
  die("<pre>" . print_r($_POST, true) . "
"); } ?> AJAX сдать тест jQuery.noConflict (); jQuery (документ) .ready (function ($) { var $ form = $ ('# default_contact'); $ form.submit (function () { $ .Ajax ({ тип: 'POST', url: $ form.attr ('действие'), данные: $ form.serialize (), success: function (response) { оповещение (ответ); } }); вернуть ложь; }); });
2 голосов
/ 27 апреля 2010

Если ваш html настроен так, чтобы форма работала самостоятельно, тогда она будет работать как обычная форма без jquery Так что уберите атрибут action из html и измените ваш jquery на: 

url: your-submit-file.php,

Если это не сработает, попробуйте: 

jQuery(document).ready( function($) {
    var $form = $('#default_contact');

    $form.submit( function(event) {
        $.ajax({
            type: 'POST',
            url: your-submit-file.php,
            data: $form.serialize(),
            success: function( response ) {
                console.log( response );
            }
    });
    event.preventDefault;
    return false;
});

Кроме того, вы пробовали использовать $ .post () в jQuery? Гораздо проще в использовании ...

0 голосов
/ 31 августа 2012

У меня была похожая проблема - моя проблема заключалась в том, что во время публикации формы я использовал $ («форма»). Submit, чтобы что-то сделать до отправки страницы. это что-то включало в себя jquery post action. к сожалению, действие публикации не завершится до того, как заполнится форма, и, следовательно, позже возникнут проблемы - мой код выглядел так: 

        $("form").submit(function () {
                var result =
                    $.post('/Controller/Action',
                    { data: array.toString() }
            });

Решение было 

        event.preventDefault;

непосредственно перед возвратом true, что останавливает отправку формы до завершения вызова ajax.

...