我有一个【模板发布】页面,代码,预览图如下
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="<%=request.getContextPath()+"/resources/js/jquery-1.7.1.js"%>"></script> <script type="text/javascript" src="<%=request.getContextPath()+"/resources/js/uploadPanel.js"%>"></script> <title>发布模板</title> </head> <body> <form action="<%=request.getContextPath()+"/faceController/insert" %>" method="post" enctype="multipart/form-data"> <table> <tr> <td><input id="face_submit" type="submit" value="发布" /></td> </tr> <tr> <td>标题:</td> <td><input type="text" name="title" value=""/></td> </tr> <tr> <td>描述:</td> <td><textarea rows="10" cols="50" name="message"></textarea></td> </tr> <tr> <td><input type="hidden" name="fileIds" value=""></td> </tr> </table> </form> <input type="button" name="checkButton" value="选择文件" onclick="clickButton()" style="cursor:pointer;"/> <form id="upload_panel_form" action="<%=request.getContextPath()+"/fileController/upload" %>" method="post" enctype="multipart/form-data"> <input id="checkFile" class="checkFile" type="file" style="display: none;" name="files" accept=".zip,.jpg,.jpeg" value="选择文件" onchange="changeList()" multiple="multiple"/> </form> <div id="upload_panel_list_div" class="upload_panel_list_div"> <table id="upload_panel_list_table" class="upload_panel_list_table"> <tbody id="upload_panel_list_table_tbody" class="upload_panel_list_table_tbody"> <tr> </tr> </tbody> </table> </div> </body> </html>
function clickButton(){ $(".checkFile").click(); } var xhr; function changeList(){ var fd = new FormData(); var files = document.getElementById('checkFile').files; if(files.length == 0){ alert("请选择需要上传的文件"); return; } var tbody = $("#upload_panel_list_table_tbody"); for (var i = 0; i < files.length; i++) { var file = files[i]; var fileSize = file.size; var fileName = file.name; var fileType = fileName.split('.')[fileName.split('.').length-1]; var td = ''; if(fileType == 'jpg'){ td = "<td class='upload_panel_table_td_width1'><img class='temp-uploading-img' alt='' src='/service/resources/image/loding-image.gif' width='100px'></td>"; var tr = $('#upload_panel_list_table_tbody tr:last'); tr.append(td); if(tr.children('td').length == 3){ tbody.append("<tr></tr>"); } fd.append("files", files[i]); } } $("#face_submit").attr("disabled","disabled"); xhr = new XMLHttpRequest(); xhr.open("POST", document.getElementById('upload_panel_form').action); xhr.onreadystatechange = callback; xhr.send(fd); } function callback(){ if(xhr.readyState == 4){ if (xhr.responseText != null && xhr.responseText != ''){ $("#checkFile").value = ""; var result = xhr.responseText; //此处需转换。 var json = eval("(" + result + ")").fileList; // filePath // alert($(".temp-uploading-img").length); var files = $("input[name='fileIds']"); var files_val = files.val(); for (var int = 0; int < json.length; int++) { var fileJson = json[int]; var img = $(".temp-uploading-img").eq(0); img.attr("src",fileJson.filePath); img.removeClass(); files_val += files_val == '' ? fileJson.id : ("~" + fileJson.id); } $("#face_submit").removeAttr("disabled"); files.val(files_val); } } }
此处,我选择图片后,会先将图片上传到服务器,然后在页面记录图片上传后返回的id。
需要注意的是,我此处的上传路径,也就是realPath,并不是与在该项目中的,而是我自己建立的一个文件服务器。如果需要再本项目中,你可以在realPath前加入request.getContextPath()等项目路径。
下面是文件上传的java代码:
@RequestMapping("upload") public void uploadFaceImage(HttpServletRequest request,HttpServletResponse response,ModelAndView modelAndView,RedirectAttributes attr,@RequestParam MultipartFile[] files,Face face) throws IOException{ Calendar calendar = Calendar.getInstance(); User user = (User) request.getSession().getAttribute(WebKeys.USERKEY); String realPath = "/" + "uploadfile" + "/" + user.getUserId() + "/" + calendar.get(Calendar.YEAR) + "_" + (calendar.get(Calendar.MONTH) + 1) + "_" + calendar.get(Calendar.DAY_OF_MONTH); File temp = new File(realPath); if(!temp.exists()){ temp.mkdirs(); } List<com.face.model.File> fileList = new ArrayList<com.face.model.File>(); for (MultipartFile multipartFile : files) { if(multipartFile.isEmpty()){ System.err.println("-----------上传失败---------------"); }else{ com.face.model.File file = new com.face.model.File(); String fileName = System.currentTimeMillis() + "_" + Math.round(new Random().nextDouble() * 100000) + multipartFile.getOriginalFilename().substring(multipartFile.getOriginalFilename().lastIndexOf(".")); file.setFileName(fileName); file.setFileOldName(multipartFile.getOriginalFilename()); file.setFileSize(BigDecimal.valueOf(multipartFile.getSize())); file.setFileType(multipartFile.getContentType()); file.setFilePath(realPath + "/" + file.getFileName()); file.setUploadUserId(user.getId()); file.setCreateTime(new Date()); file.setId(fileService.getSequence()); FileUtils.copyInputStreamToFile(multipartFile.getInputStream(), new File(realPath,file.getFileName())); fileList.add(file); } } Map<String,Object> data = new HashMap<String,Object>(); if(fileList.size() > 0){ int result = fileService.inserFileBatch(fileList); if(result > 0) data.put("fileList",fileList); } response.setCharacterEncoding("UTF-8"); response.setContentType("application/json; charset=utf-8"); String json = JSON.toJSONStringWithDateFormat(data, "YYYY-MM-dd HH-mm-ss"); System.out.println(json); PrintWriter out = null; try { out = response.getWriter(); out.append(json); } catch (IOException e) { e.printStackTrace(); }finally{ out.close(); } }
因为使用的是oracle,所以批量保存这里稍稍麻烦了一点。
我是先查出id号,然后写入File实体的id字段,然后再进行批量保存的。
下面是我的mapper:
<select id="getSequence" resultType="java.math.BigDecimal"> SELECT SEQ_T_FILE.nextval as ID from dual </select> <insert id="insertFileBatch" parameterType="java.util.List"> insert into T_FILE select A.* from( <foreach collection="list" item="item" index="index" separator="UNION"> SELECT #{item.id}, #{item.fileSize}, #{item.fileOldName}, #{item.fileName}, sysdate, #{item.uploadUserId}, #{item.filePath}, #{item.fileType} from dual </foreach> ) A </insert>
当然,如果你不需要记录文件上传后保存到数据库的id的话,就可以不用这么麻烦,可以如下方式,直接批量保存:
<insert id="insertFileBatch" parameterType="java.util.List"> insert into T_FILE select SEQ_T_FILE.nextval,A.* from( <foreach collection="list" item="item" index="index" separator="UNION"> SELECT #{item.fileSize}, #{item.fileOldName}, #{item.fileName}, sysdate, #{item.uploadUserId}, #{item.filePath}, #{item.fileType} from dual </foreach> ) A </insert>
此处要注意,所有#字段的先后顺序是以数据库中的先后顺序来排序的,如果与数据库默认的不对应,就会报错。
相关推荐
Java基于Spring+SpringMVC+MyBatis实现的学生信息管理系统源码,SSM+Vue的学生管理系统。 Java基于Spring+SpringMVC+MyBatis实现的学生信息管理系统源码,SSM+Vue的学生管理系统。 Java基于Spring+SpringMVC+...
完善的Spring+SpringMVC+Mybatis+easyUI后台管理系统(RESTful API+redis).zip 完善的Spring+SpringMVC+Mybatis+easyUI后台管理系统(RESTful API+redis).zip 完善的Spring+SpringMVC+Mybatis+easyUI后台管理系统...
springmvc+mybatis+bootstrap框架+oracle数据库 1、兼容BootStrap,兼容Jquery UI。所以可以用bootstrap和jqueryui的功能。当然还有jquery了。 2、图标使用font awesome 3.2,可以使用字体图标 3、表格可以用...
基于Spring+SpringMVC+Mybatis架构的博客系统:博客管理、图表数据、日志分析、访问记录、图库管理、资源管理、友链通知等。良好的页面预加载,无限滚动加载,文章置顶,博主推荐等。提供 用户端+管理端 的整套系统...
JAVA SpringMVC+mybatis(oracle 和 mysql) HTML5 后台框架 bootstrap.docxJAVA SpringMVC+mybatis(oracle 和 mysql) HTML5 后台框架 bootstrap.docxJAVA SpringMVC+mybatis(oracle 和 mysql) HTML5 后台框架 ...
基于SSM(Spring+SpringMVC+Mybatis)的新闻管理系统源码+数据库.zip 基于SSM(Spring+SpringMVC+Mybatis)的新闻管理系统源码+数据库.zip 基于SSM(Spring+SpringMVC+Mybatis)的新闻管理系统源码+数据库.zip 基于SSM...
在线投票系统-jsp+springMVC+mybatis在线投票系统-jsp+springMVC+mybatis在线投票系统-jsp+springMVC+mybatis在线投票...jsp+springMVC+mybatis在线投票系统-jsp+springMVC+mybatis在线投票系统-jsp+springMVC+mybatis
在"SpringMVC+Mybatis demo"中,MyBatis与Spring结合,通过Spring的SqlSessionFactoryBean创建SqlSessionFactory,进一步生成SqlSession实例。Mapper接口的实现通常会使用`@Mapper`注解,这样Spring能够自动扫描并...
基于 SpringBoot + Spring + SpringMvc + Mybatis + Shiro+ Redis 开发单点登录管理系统 基于 SpringBoot + Spring + SpringMvc + Mybatis + Shiro+ Redis 开发单点登录管理系统 基于 SpringBoot + Spring + ...
《图书管理系统SpringMvc+Mybatis实现详解》 在IT领域,构建高效、稳定的软件系统是至关重要的。本项目“图书管理系统”就是这样一个实例,它利用了SpringMvc和Mybatis两大主流框架,为图书管理提供了全面的解决...
标题 "Spring+SpringMVC+Mybatis资源课件" 提供了一个学习路径,涉及Java开发中的三个关键组件:Spring框架、SpringMVC和Mybatis。这些技术是构建现代企业级Web应用程序的基础,尤其是在Java世界中。 Spring框架是...
本项目框架“maven+springMVC+mybatis+velocity+mysql+junit”提供了一种高效、灵活且可维护的解决方案。以下将详细讲解这些组件及其作用。 1. Maven: Maven是一个项目管理工具,用于构建、依赖管理和项目信息...
毕设项目:基于SpringMVC+MyBatis开发学生管理系统 毕设项目:基于SpringMVC+MyBatis开发学生管理系统 毕设项目:基于SpringMVC+MyBatis开发学生管理系统 毕设项目:基于SpringMVC+MyBatis开发学生管理系统 毕设项目...
在IT行业中,构建高效、可扩展的Web应用是至关重要的,而"spring+springMVC+mybatis+quartz动态定时任务创建"就是一个常见的技术栈,用于实现这样的目标。这个组合充分利用了各组件的优势,提供了强大的后端服务支持...
酒店管理系统源码(spring+springmvc+mybatis) 酒店管理系统源码(spring+springmvc+mybatis) 酒店管理系统源码(spring+springmvc+mybatis) 酒店管理系统源码(spring+springmvc+mybatis) 酒店管理系统...
Spring+SpringMVC+MyBatis+Shiro+MySQL+Redis+Maven+EasyUI+Bootstrap实现的通用权限管理系统。 Spring+SpringMVC+MyBatis+Shiro+MySQL+Redis+Maven+EasyUI+Bootstrap实现的通用权限管理系统 Spring+SpringMVC+...
Spring、SpringMVC和Mybatis是Java开发中最常用的三大开源框架,它们的整合使用,通常被称为SSM框架。这个框架组合提供了完整的后端服务解决方案,包括依赖注入(DI)、面向切面编程(AOP)、模型-视图-控制器(MVC...
"SpringMvc+Spring+Mybatis+Maven+注解方式"是一个经典的Java后端技术栈,它整合了四个关键组件,为开发人员提供了强大的工具和框架支持。下面将详细讲解这四个组件及其整合方式。 1. **Spring Framework**: ...
Spring、SpringMVC、Mybatis、Velocity和Maven是Java Web开发中常用的一组技术栈,它们各自在软件开发的不同层面发挥着重要作用。这个压缩包文件的标题和描述表明,它提供了一个集成这些技术的演示项目,下面我们将...
基于SpringMVC+Spring+MyBatis个人技术博客系统源码.zip 完整代码,可运行 项目描述 基于SSM实现的一个个人博客系统,适合初学SSM和个人博客制作的同学学习。有了这个源码,直接买了阿里云或腾讯服务器,就可以部署...