亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

解析ajaxFileUpload 異步上傳文件簡單使用

Original 2017-01-13 14:43:54 493
abstract:這里就簡單介紹下ajaxFileUpload,jQuery插件AjaxFileUpload可以實現(xiàn)ajax文件上傳。我們的項目采用的是jsp跟js分離的架構(gòu),所以代碼如下。首先是jsp部分:<!-- <form method="post"> -->     <input 

這里就簡單介紹下ajaxFileUpload,jQuery插件AjaxFileUpload可以實現(xiàn)ajax文件上傳。我們的項目采用的是jsp跟js分離的架構(gòu),所以代碼如下。

首先是jsp部分:

<!-- <form method="post"> -->
    <input type="file" name="n_file" id="fileToUpload" value="上傳表格" />
     <button id="upload1" class="btn btn-default">上傳</button>
<!-- </form> -->

這里說下 為什么把form注釋了,因為我的jsp中已經(jīng)有了另外一個form 在調(diào)試過程中發(fā)現(xiàn)可能有沖突就把form注釋了,事實證明ajaxFileUpload 不用form表單一樣可以提交,下面就是js代碼部分:

$(function(){ 
  //點擊打開文件選擇器 
  $("#upload1").on('click', function() { 
    //選擇文件之后執(zhí)行上傳 
  
    $.ajaxFileUpload({ 
      url:'supplyDataReportUploadExcel', //url自己寫 
      secureuri:false, //這個是啥沒啥用
      type:'post',
      fileElementId:'fileToUpload',//file標(biāo)簽的id 
      dataType: 'json',//返回數(shù)據(jù)的類型 
      //data:{name:'logan'},//一同上傳的數(shù)據(jù) 
      success: function (data, status) { 
//       alert(data);
//       alert(data.msg);  
//       alert(data.success);
        if(data.success){
          alert("upload,success!!!");
          window.location.href='supplyDataReport';
        }else{
          alert(data.msg);
          window.location.href='supplyDataReport';
        }
          
      }/*, 
      error: function (data, status, e) { 
        alert(e); 
      }*/ 
    }); 
  
  }); 
  
});

本人js不好,只是會用這個js不能完全copy走,要結(jié)合項目結(jié)構(gòu)的實際情況,不過大體參數(shù)干什么的注釋都寫了。一定注意type是post跟請求對應(yīng)的Controller的方法的method=RequestMethod.POST 一致。注意dataType:'json'  ,一定注意json的大小寫。

ps:這里要說一下我用的data.success做的判斷跟后面的一個實體類AjaxJson有關(guān)系,注意?。。。?!

對了 jsp中還需要引入 對應(yīng)的js如下:

<script type="text/javascript">Core.js('./js/iface/upload');</script>
<script type="text/javascript" src="libs/jquery/ajaxfileupload.js"></script>

第一段引入的upload 就是上面js的內(nèi)容,我們的引入js已經(jīng)被封裝好了,所以直接寫那就行,具體結(jié)合實際情況 ,下面的要用到的jQuery插件AjaxFileUpload的js文件。

接下來是Controller方法如何相應(yīng):

@SuppressWarnings("resource")
@RequestMapping(value = "/supplyDataReportUploadExcel", method = RequestMethod.POST)
public @ResponseBody String supplyDataReportUploadExcel(HttpServletRequest request, HttpServletResponse response,MultipartFile n_file) throws Exception {
  AjaxJson json = new AjaxJson();
  ObjectMapper mapper = new ObjectMapper();
  UploadFormBackVo uploadFormBackVo = new UploadFormBackVo();
  //判斷是否是空的Excel 包括沒有標(biāo)題
  if(n_file.getSize()>0){
    try{
      //先判斷 文件名 是否符合規(guī)格 因為不知道怎么獲取上傳文件的路徑 后期修改
      //獲取文件
      //驗證文件名
      String fileName = n_file.getOriginalFilename();
      String fileNewName = fileName.replaceAll(".xls", "");
      String eL = "[a-zA-Z]+[0-9]{4}-[0-9]{2}-[0-9]{2}";
      Pattern p = Pattern.compile(eL);
      Matcher m = p.matcher(fileNewName);
      boolean dateFlag = m.matches();
      if (!dateFlag) {
        System.out.println("格式錯誤");
        uploadFormBackVo.setFormName(n_file.getOriginalFilename());
        uploadFormBackVo.setUploadTime(new Date());
        uploadFormBackVo.setIfsuccess("上傳失敗,Excel文件名不符合規(guī)格?。?!");
        supplyDataReportService.INSERT(uploadFormBackVo);
          
        json.setSuccess(false);
        json.setMsg("Excel,NameError!!!");
        String jsonStr = mapper.writeValueAsString(json);
        return jsonStr;
      }
      //上傳文件
      UploadUtil.SaveFileFromInputStream(n_file.getInputStream(), "D:/補數(shù)據(jù)報表文件", n_file.getOriginalFilename());
      InputStream is2 = new FileInputStream("D:/補數(shù)據(jù)報表文件/"+n_file.getOriginalFilename());
        
      //讀取文件進行內(nèi)容驗證
      ExcelReader excelReader = new ExcelReader();
        
      Map<Integer, SupplyDataReportBackVo> supplyDataReportBackVos = new HashMap<Integer, SupplyDataReportBackVo>();
        
        
      String jsonStr = excelReader.readExcelContent(is2,supplyDataReportBackVos,json,n_file);
      //判斷 readExcelContent()解析Excel文件 是否符合規(guī)范 如果符合 修改相應(yīng)數(shù)據(jù) 
      if(json.isSuccess()==true){
         //遍歷map 用value --》SupplyDataReportBackVo 調(diào)用  UPDATEById方法
        for(SupplyDataReportBackVo supplyDataReportBackVo : supplyDataReportBackVos.values()){
          supplyDataReportService.UPDATEById(supplyDataReportBackVo);
        }
          
        System.out.println("獲得Excel表格的內(nèi)容:");
        for (int i = 1; i <= supplyDataReportBackVos.size(); i++) {
            
          System.out.println(supplyDataReportBackVos.get(i));
        }
        //保存上傳記錄
        uploadFormBackVo.setFormName(n_file.getOriginalFilename());
        uploadFormBackVo.setUploadTime(new Date());
        uploadFormBackVo.setIfsuccess("上傳成功");
        supplyDataReportService.INSERT(uploadFormBackVo);
        return jsonStr;
      }
      // 解析Excel 文件 中  有空值 保存這次上傳的記錄且刪除已上傳的Excel文件, 刪除已上傳的Excel文件已在 readExcelContent()中處理
      uploadFormBackVo.setFormName(n_file.getOriginalFilename());
      uploadFormBackVo.setUploadTime(new Date());
      uploadFormBackVo.setIfsuccess("上傳失敗,Excel中有空值!??!");
      supplyDataReportService.INSERT(uploadFormBackVo);
      return jsonStr;
    } catch (IOException e){
      System.out.println(e.getMessage());
    }
  }else{
    //ajax返回的數(shù)據(jù)
    json.setSuccess(false);
    json.setMsg("Upload File Null!!!!!");
    String jsonStr = mapper.writeValueAsString(json);
    return jsonStr;
  }
  System.out.println("ajax請求成功");
  return "";
    
/    json.setMsg("upload,success!!!");
    
}

這個方法注意幾個地方就行,其他的都是樓主本人自身的業(yè)務(wù)邏輯,第一@RequestMapping中請求的方式為POST,第二傳入的參數(shù)有個MultipartFile  n_file,這個n_file要跟jsp中的<input>標(biāo)簽中name屬性對應(yīng)。第三要注意返回值Sting上的一個注解@ResponseBody,剩下兩個需要注意的地方就是AjaxJson,ObjectMapper。

AjaxJson是自己封裝的一個model類,用來處理ajax的,至于ObjectMapper是用來轉(zhuǎn)換類型的具體的自己百度或者腦補吧,樓主也緊緊限于會用。下面貼上AjaxJson:

package com.zhongxin.web.ops.adrule.model;  
import java.util.Map;  
public class AjaxJson {    
  private boolean success = true;    
  private String msg = "ok";    
  private Object obj = null;    
  private Map<String, Object> attributes;    
  public boolean isSuccess() {
    return success;
  }
  public void setSuccess(boolean success) {
    this.success = success;
  }
  public String getMsg() {
    return msg;
  }
  public void setMsg(String msg) {
    this.msg = msg;
  }
  public Object getObj() {
    return obj;
  }
  public void setObj(Object obj) {
    this.obj = obj;
  }
  public Map<String, Object> getAttributes() {
    return attributes;
  }
  public void setAttributes(Map<String, Object> attributes) {
    this.attributes = attributes;
  }
    
}

更多關(guān)于解析ajaxFileUpload 異步上傳文件簡單使用請關(guān)注PHP中文網(wǎng)(ipnx.cn)其他文章!   


Release Notes

Popular Entries