我正在尝试将 juqery fileupload 与 ajax 表单提交集成。 ajax 表单发送文本并返回新创建事件的 ID,这对于知道上传时链接到哪个事件是必要的。 简单的上传演示使用以下代码
这是首先上传非文件字段的ajax
$.ajax({
type: 'post',
url: '/whats-on/upload-event/',
data: JSON.stringify(data),
contentType: "application/json; charset=utf-8",
traditional: true,
success: function (return_data) {
console.log(return_data)
}
});
它返回以下 json
Object {status: true, id: 17162}
但是,文件上传发送文件时没有声明 data: data,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>jQuery File Upload Example</title>
</head>
<body>
<input id="fileupload" type="file" data-url="server/php/">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/vendor/jquery.ui.widget.js"></script>
<script src="js/jquery.iframe-transport.js"></script>
<script src="js/jquery.fileupload.js"></script>
<script>
$(function () {
$('#fileupload').fileupload({
dataType: 'json',
done: function (e, data) {
//Returns ID as e['id'] and 200 status also with e['status']
}
});
});
</script>
</body>
</html>
最佳答案
您首先需要通过 ajax post 获取事件 ID:
function uploadClick(){
var eventId = getEvent();
uploadFile(eventId)
}
function getEvent(){
// make an ajax and return your id
}
一旦您得到它,然后创建一个带有指示 eventId 的查询字符串的 URL。此 URL 是您要发布文件的位置:
function uploadFile(eventId){
// attatch the id to the URL with query string
url = url + '&eventId=' + eventId;
// submit here your file
}
这样你就可以在同一个ajax调用中发布文件本身和事件id。在服务器端操作中,您需要获取此查询字符串,然后选择发布的文件。
关于javascript - 向 Simple Jquery FileUpload 添加附加信息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39953840/