странное поведение при использовании $ ('. ajax_form'). ajaxForm (); - PullRequest
Новая
       11

странное поведение при использовании $ ('. ajax_form'). ajaxForm ();

3 голосов
/ 26 мая 2009

Я впервые применяю jquery ajaxForm к классу, подобному следующему 

<form class="ajax_form"...><input type="text" name="q" /><input type="submit" /></form>
<form class="ajax_form"...><input type="text" name="q" /><input type="submit" /></form>

<script>
$('.ajax_form').ajaxForm({
  dataType: 'json',
  error: ajaxErrorHandler,
  success: function(response) { // do some ui update .. }
});
</script>

Теперь, после завершения вызова Ajax, я всегда попадаю в секцию ошибок , хотя firebug не сообщал о каких-либо ошибках, но не уверен, что я сделал не так.

Ответы [ 6 ]

11 голосов
/ 17 сентября 2009

Это может быть или не уместно в этом случае, но я предоставлю это, потому что это было бы полезно для меня, когда я искал ответ на подобную проблему. Если вы отправляете форму «multipart / form-data» с загрузкой файла в Firefox, jquery.form будет использовать iframe для отправки формы. Если тип возвращаемых вами данных типа text / plain, iframe обернет полученный текст тегами 

, которые будут обрабатывать jquery-анализатор json и выдают ошибку синтаксического анализатора, даже если Firebug правильно показывает ответ и даже json , 

 Это вызвало у меня бесконечные головные боли, прежде чем я понял это (с помощью этой темы: http://www.extjs.com/forum/archive/index.php/t-17248.html).

 Ответ в моем случае состоял в том, чтобы убедиться, что тип содержимого ответа "text / html" (что было нелогично, по крайней мере для меня).
1 голос
/ 14 июня 2009

Проблема с данными JSON. Они, вероятно, не очень хорошо сформированы и не могут быть проанализированы. В этом случае функция успеха не будет вызвана.

Вы можете проверить это, если печатаете сообщения об ошибке. Используйте следующий код: 

url = url + "?" + $(".ajaxForm").serialize();
$(".ajaxForm").ajax({url: url, dataType: "json", type : "post",
                    success: function(response) {},
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        console.log(textStatus);
                        console.log(errorThrown);
                    }});

Одной из распечаток должно быть что-то вроде "ошибки синтаксического анализатора".

1 голос
/ 26 мая 2009

@c.sokun: Использование класса здесь не должно быть проблемой, если только одна форма использует класс. Две формы с одним и тем же классом на одной странице определенно вызовут сбой (обратитесь к вашему коду ... или это опечатка?)

Вы пытались использовать FireBug и проверяли переданные параметры и возвращаемые значения? Это должно быть первым!

0 голосов
/ 14 июня 2009

Ну, я проверил в API и не нашел ссылки на поле опций, называемое «ошибка», так что, вероятно, в этом причина. Отметьте здесь .

0 голосов
/ 12 июня 2009

ajaxErrorHandler определен в другом месте? Я попробовал ваш код, и он работал отлично. Какую версию форм jQuery и jQuery вы используете?

Это код, который я пробовал. С файлом с именем 'test.json', содержащим "{test: 'hello world'}" в том же каталоге, что и этот тест: 

<script type="text/javascript" src="http://malsup.com/jquery/jquery-1.2.6.js"></script>
<script type="text/javascript" src="http://malsup.com/jquery/form/jquery.form.js?2.28"></script>

<form class="ajax_form" action="test.json" method="post"><input type="text" name="q" /><input type="submit" /></form>
<br/>
<form class="ajax_form" action="test.json" method="post"><input type="text" name="q" /><input type="submit" /></form>

<script>
$('.ajax_form').ajaxForm({
  dataType: 'json',
  error: function() {alert("error");},
  success: function(response) {alert(response.test);}
});
</script>
0 голосов
/ 26 мая 2009

Я думаю, вам понадобится URL-адрес и тип записи для формы, куда можно отправить данные?

Вот как они настроили на jquery.com : 

$("#myform").ajaxForm({
   url: "mypage.php",
   type: "POST"
 });
...