JQuery AJAX форма успеха обратного вызова не вызывается - PullRequest
Новая
       1

JQuery AJAX форма успеха обратного вызова не вызывается

12 голосов
/ 15 сентября 2010

Я пытаюсь загрузить файл, используя «AJAX», обработать данные в файле и затем вернуть некоторые из этих данных в пользовательский интерфейс, чтобы я мог динамически обновлять экран.

Я используюJQuery Ajax Form Plugin, jquery.form.js, найденный в http://jquery.malsup.com/form/ для javascript и использующий Django на заднем плане.Форма отправляется, и обработка на стороне сервера проходит без проблем, но когда ответ получен с сервера, мой браузер Firefox предлагает мне загрузить / открыть файл типа «application / json».Файл содержит содержимое json, которое я пытался отправить в браузер.

Не думаю, что это проблема с тем, как я отправляю json, поскольку у меня есть модульная функция json_wrapper()Я использую это приложение в нескольких местах.

Вот как выглядит моя форма после применения шаблонов Django: 

<form method="POST" enctype="multipart/form-data" action="/test_suites/active/upload_results/805/">
  <p>
     <label for="id_resultfile">Upload File:</label> 
     <input type="file" id="id_resultfile" name="resultfile">
  </p>  
</form>

Вы не увидите никаких кнопок отправки, потому что яЗвоню отправить с помощью кнопки еще где и использую ajaxSubmit () из плагина jquery.form.js.

Вот управляющий код JavaScript: 

function upload_results($dialog_box){
    $form = $dialog_box.find("form");
    var options = {
            type: "POST",
            success: function(data){
                alert("Hello!!");
            },
            dataType: "json",
            error: function(){
                console.log("errors");

            },
            beforeSubmit: function(formData, jqForm, options){
                    console.log(formData, jqForm, options);
                },
        }
    $form.submit(function(){
        $(this).ajaxSubmit(options);
        return false;
    });
    $form.ajaxSubmit(options);
}

Как вы можете видетьЯ отчаялся увидеть, как работает функция обратного вызова success, и просто создал предупреждающее сообщение об успехе.Однако мы никогда не дойдем до этого звонка.Кроме того, функция error не вызывается, и выполняется функция beforeSubmit.

Файл, который я получаю, имеет следующее содержимое: 

{"count": 18, "failed": 0, "completed": 18, "success": true, "trasaction_id": "SQEID0.231"}

Я использую «success»здесь, чтобы указать, смог ли сервер выполнить команду post должным образом.В случае неудачи результат будет выглядеть примерно так: 

{"success": false, "message":"<error_message>"}

Мы ценим ваше время и помощь.Я потратил несколько дней на это сейчас и хотел бы двигаться дальше.

Ответы [ 4 ]

3 голосов
/ 31 декабря 2010

В случае, если у кого-то возникла подобная проблема, вот заключительный javascript, который я использовал: 

function upload_results_dialog($data_elem){
    var $dialog_box = $("#ajax-dialog-box"),
    data = $data_elem.attr("data");
    $.ajax({
        url: "../upload/" + data+ "/",
        success: function(response){
            $dialog_box.html(response);
            $dialog_box.dialog("option",
                {
                    title: "Upload",
                    height: 260,
                    width: 450,
                    buttons: {
                        Cancel: function(){
                            $(this).dialog('close');
                        },
                        Upload: function(){
                            upload($(this));
                        }
                    }
                }
            );
            $dialog_box.dialog('open');
        }
    });
}
function upload($dialog_box){
    var $form = $dialog_box.find("form"),
      iframe = $dialog_box.find("iframe"),
      $html = $($iframe.contents()),
      $iframe_form = $html.find("form");
    $iframe_form.html($form.contents());

    //Set the onload function
    $iframe.attr("onload","check_file_uploaded_valid()");
    $iframe_form.submit();
}
2 голосов
/ 09 июня 2012

Случилось и со мной. Проблема оказалась в том, что сервер не конвертировал весь объект в правильный JSON. Изменили возвращаемое значение только на те свойства, которые мне были нужны: 

return Json(new {Id = group.Id, Name = group.Name});
2 голосов
/ 13 октября 2010

Хорошо, я только что потратил часы с этой же проблемой, просматривая файл js построчно. Он работал одну секунду, а затем - нет. Моя проблема была - я удалил целевой div для результатов. Как только я положил его обратно, все заработало.

0 голосов
/ 22 мая 2011

Вам нужно вызвать $('#form-id').ajaxForm(); в событии готового документа jQuery, чтобы плагин регистрировал все обработчики событий.

...