Jquery ajax form call callback не называется
Я пытаюсь загрузить файл с помощью "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>
Вы не увидите никаких кнопок отправки, потому что я вызываю submit с помощью кнопки else, где и я использую 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"}
Я использую здесь "успех", чтобы указать, мог ли сервер правильно выполнить команду post. Если это не получилось, результат будет выглядеть примерно так:
{"success": false, "message":"<error_message>"}
Ваше время и помощь приветствуются. Я потратил несколько дней на это сейчас и хотел бы двигаться дальше.
Ответы
Ответ 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();
}
Ответ 2
Хорошо, я просто потратил часы с этой же проблемой, проходящей через файл js по строкам. Он работал на одну секунду, а затем на следующее не было. Моя проблема была - я удалил целевой div для результатов. Как только я вернул это, он отлично работал.
Ответ 3
Случилось и со мной. Проблема оказалась, что сервер не преобразовал весь объект в правильный JSON. Изменено возвращаемое значение только для необходимых мне свойств:
return Json(new {Id = group.Id, Name = group.Name});
Ответ 4
Вам нужно вызвать $('#form-id').ajaxForm();
в событии jQuery, готовом к документу, чтобы плагин регистрировал все обработчики событий.