我试图使用“
AJAX”上传文件,在文件中处理数据,然后将一些数据返回给UI,以便我可以动态更新屏幕.
我正在使用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>
你不会看到任何提交按钮,因为我正在调用提交与一个按钮其他地方,并在jquery.form.js插件使用ajaxSubmit().
这是控制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,options); },} $form.submit(function(){ $(this).ajaxSubmit(options); return false; }); $form.ajaxSubmit(options); }
正如你所看到的,我已经迫不及待地看到成功的回调函数工作,并且只需要在成功时创建一个警报消息.但是,我们从来没有达到这个要求.此外,不调用错误函数,执行beforeSubmit函数.
{"count": 18,"Failed": 0,"completed": 18,"success": true,"trasaction_id": "SQEID0.231"}
我在这里使用’成功’来表示服务器是否能够充分地运行post命令.如果失败,结果将如下所示:
{"success": false,"message":"<error_message>"}
你的时间和帮助是非常感谢.我现在已经花了几天时间,很乐意继续前进.
解决方法
如果有人遇到类似的问题,这里是最终的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(); }