国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

Bootstrap Fileinput 4.4.7文件上傳實例詳解

2019-11-19 13:24:57
字體:
來源:轉載
供稿:網友

本實例所做功能為發送帶附件郵件,可以上傳多個附件,操作為選擇一個附件以后自動上傳,然后繼續選擇附件,填寫完表單其他信息,點擊保存發送帶附件郵件。

HTML標簽

<input id="fileUpload" type="file" name="file" data-show-preview="true" multiple/>

js初始化,設置全局文件名參數

var fileName = [];function initFileInput(id, url) {    $("#" + id).fileinput({      language: 'zh',       uploadAsync:false,      uploadUrl:url,      browseClass: "btn btn-secondary",      textEncoding:"UTF-8",      showUpload: false,      showPreview :true,      dropZoneEnabled: false,      maxFileCount:5,      fileActionSettings:{        showUpload: true      },      enctype:'multipart/form-data',      msgFilesTooMany: "選擇上傳的文件數量({n}) 超過允許的最大數值{m}!",    }).on("filebatchselected", function(event, files) {      $("#fileUpload").fileinput("upload");    }).on("filebatchuploadsuccess", function (event, data, previewId, index){      if(data.response.success == true)      {        fileName.push(data.response.fileName);      }else{        alert("上傳失敗!");      }      $("#fileUpload").fileinput("clear");      $("#fileUpload").fileinput("reset");    }).on('fileerror', function(event, data, msg) {       alert(msg);    });  }

java后臺上傳文件代碼

@RequestMapping(value="/fileupload")  @ResponseBody  public Map<String, Object> fileUpload(HttpServletRequest request, HttpServletResponse response) {    ResourceBundle bundle = PropertyResourceBundle.getBundle("application");    MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest)request;    Map<String,MultipartFile> fileMap = multipartRequest.getFileMap();    String rootPath = bundle.getString("upLoadUrl");    String filePath = rootPath;    Map<String, Object> map = new HashMap<>();    map = uploadFiles(filePath,fileMap);    return map;  }

實際上傳操作,返回上傳操作經過處理的文件名,保證服務器端文件名唯一

public Map<String, Object> uploadFiles(String savePath,Map<String,MultipartFile> fiLeMap){    Map<String, Object> map = new HashMap<>();    try {      String fileName = "";      if(fiLeMap!=null){        for(Map.Entry<String, MultipartFile> entity:fiLeMap.entrySet()){          MultipartFile f = entity.getValue();          if(f != null && !f.isEmpty()){            String uuid = UUID.randomUUID().toString();            fileName = uuid + "#" + f.getOriginalFilename();            File newFile = new File(savePath + "/" + fileName);             f.transferTo(newFile);          }        }      }      map.put("success", true);      map.put("fileName", fileName);      return map;    }catch (Exception e) {      map.put("success", false);      return map;   }}

ajax提交其他表單參數和所傳附件文件名集合

$.ajax({      type: "POST",      url: 所需要請求地址,      dataType: "json",      traditional:true,      data: {        service:$("#service").select2('val').replace("All",""),        startTime:$("#start").val(),        endTime:$("#end").val(),        reason:$("#reason").val(),        fileName:JSON.stringify(fileName),        outterEmail:isOutterEmail,        innerEmail:isInnerEmail,        isSendEmail:isSendEmail,        subService:$("#subService").select2('val'),        runningStatus:$("#runningStatus").select2('val')      },      success: function(data){        $("#loadingModal").modal("hide");        fileName.splice(0,fileName.length);        alert(data.msg);        if(data.success) {          location.href = "revision";        }      },      error:function(xhr) {        $("#loadingModal").modal("hide");        alert("保存失敗");      }    });

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 康保县| 龙口市| 建始县| 江阴市| 崇信县| 金阳县| 太仓市| 额尔古纳市| 永靖县| 沁水县| 涿州市| 呈贡县| 抚松县| 龙口市| 嘉兴市| 平湖市| 武安市| 临夏市| 莱州市| 固安县| 丁青县| 锡林浩特市| 长宁县| 泽州县| 苏尼特右旗| 西华县| 田林县| 浪卡子县| 霍林郭勒市| 凤冈县| 大邑县| 石棉县| 南通市| 阿拉善左旗| 绥棱县| 西充县| 德昌县| 资源县| 湟中县| 石渠县| 吉木萨尔县|