jquery ajax form success callback не называется

Question

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

Я использую плагин JQuery Ajax Form, 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); 
} 

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

Файл, который я возвращусь имеет следующее содержание:

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

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

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

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

Answer 1

В случае, если кто имел подобную проблему, вот окончательный 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(); 
} 

Answer 2

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

Answer 3

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

Answer 4

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

return Json(new {Id = group.Id, Name = group.Name});