利用ajax实现文件上传

来源:互联网 发布:运行java需要什么软件 编辑:程序博客网 时间:2024/05/18 03:12

1 . 先看效果(这个效果需要添加Ace的css,这里就不提供源代码了)



2. 导入上传所需的jar



3 . 配置servlet.xml(不是web.xml)




4 . 引入ajaxfileupload.js



4 . 上传的输入框

 


5 . ajax传文件传文件到后台

$("#save_uploadFile").click(function(){var path = $("#path").val();//$("#uploadFileForm").attr("action","uploadFlie")if($("#uploadFlie").val()==""){confirm("Please select you excel for import"); window.location.reload();}else{$.ajaxFileUpload({      type: "POST",      url:path+"/upload/uploadFlie",      secureuri : false,//是否启用安全提交,默认为false     fileElementId:'uploadFlie',//上传的file id属性    dataType: 'json',    async : false,    success: function(data){        if(data.a==520){      confirm("Upload successful");      window.location.reload();      }else if(data.a==417){      alert("请选择和数据库表字段对应的Excel表");      window.location.reload();      }else{      alert("Excel表字段和数据表不对应,请重新选择");      window.location.reload();      }           },      error: function(XMLHttpRequest, textStatus, errorThrown) { alert("XMLHttpRequest.status:"+XMLHttpRequest.status+"\n"+"XMLHttpRequest.readyState:"+XMLHttpRequest.readyState+"\n" +"textStatus:"+textStatus);   }}); }})


6 . 后台接收处理文件

@ResponseBody@RequestMapping(value = "/uploadFlie")public UserHibernateVO upload(@RequestParam(value = "file", required = false) MultipartFile[] file, HttpSession session,HttpServletRequest req,ModelMap model) {  model.addAttribute("message"," ");  MultipartFile File = file[0];      if(File==null){System.out.println("file null");}String fileName = File.getOriginalFilename();         String suffix = fileName.substring(fileName.lastIndexOf("."));         UserHibernateVO vo = null;;         InputStream in = null;         System.out.println("fileName========="+fileName);         System.out.println("suffix========"+suffix);if(fileName.endsWith(".xlsx")||fileName.endsWith(".xls")){try {vo = new UserHibernateVO();in = File.getInputStream();iStudentManagerService.saveStudentByExcel(in, suffix);vo.setA(520);model.addAttribute("message"," upload successful");} catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();} catch (Exception e) {// TODO Auto-generated catch blocke.printStackTrace();}}else{vo = new UserHibernateVO();vo.setA(417);model.addAttribute("message"," upload failed");}return vo;}


7 . 接收如何处理自己看着办,OK,这次的用ajax上传文件已经讲解完成,谢谢您的支持










原创粉丝点击