之前用過Flash版本的uploadify,寫過一篇關於uploadify動態傳參的文章(點擊打開鏈接)。後來有了HTML5版本的上傳控件,叫uploadifive,測試着用了一下,效果還不錯。這裏主要說一下動態傳參的問題。
1.控件初始化:
在頁面載入完成的時候,初始化控件如下,跟uploadify類似:
$("#file_upload").uploadifive({
'fileObjName': 'fileData',
'auto': false,
'buttonText': "選擇文件",
'buttonClass': 'btn btn-primary',
'height': '30',
'width': '200',
'removeCompleted': true,
'uploadScript': '/FileUpload/Upload', //這裏是通過MVC裏的FileUpload控制器裏的Upload 方法
'queueID': 'uploadfileQueue',
'multi': true
//,'formData': { 'ID': 11 }----由於這裏初始化時傳遞的參數,當然就這裏就只能傳靜態參數了
});
2.動態傳參數:
動態傳參還是通過 formData參數來完成,就是在上傳之前動態能formData參數賦值。由於uploadifive並沒有提供setting方法,所以這裏能只能通過這種方式完成:
var myid=1234;
$('#file_upload').data('uploadifive').settings.formData = { 'ID': myid}; //動態更改formData的值
$('#file_upload').uploadifive('upload'); //上傳
3.後臺函數及取值
後臺是通過asp.net mvc方式完成的,將上傳函數放在了控制器裏面。
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Upload(HttpPostedFileBase fileData, long ID)//fileData即是文件的信息,ID即爲動態傳遞的參數,可以直接取值
{
return Json(new
{
FileName = fileData.FileName,
MyID = ID
});
}
當然也可以傳遞多個參數。
官方文檔上並沒有直接通過設置setting的值,網上了找了半天,參考了這篇文章中的知識點http://stackoverflow.com/questions/14057038/uploadifive-formdata-passing-through-multi-select-array/14084481。