EasyUI的filebox组件实现多文件上传的步骤
新增回款记录详情 里面有个添加回款记录文件 的按钮,点击选择文件 ,文件既可以选择一个也可以选择多个
img
点击并拖拽以移动
<tr height="35px"> <td width="25%" height="20px" align="right">添加回款记录:td> <td width="75%" height="20px" align="left"> <input class="easyui-filebox" data-options=" buttonText: '选择文件',prompt:'浏览'" multiple="true" id="addFfile" name="file" style="width:90%" onchange="checkFile()" /> td> tr>
通过添加回款记录文件的id
,如下js的写法是根据官网 来写的,先在前台把添加回款记录记录的一个改成多个 ,把multiple:true
的注释给去掉
//easyui 文件框 $('#addFfile').filebox({ buttonText: '选择文件', //按钮文本 buttonAlign: 'right', //按钮对齐 multiple: true, //是否多文件方式 onChange: function (e) { checkFile(); } });
//控制上传文件格式 function checkFile(){ var fileTypes = ['.jpg', '.jpeg', '.bmp', '.png', '.gif','.pdf']; var filePath = $('#addFfile').textbox('getValue'); /* if (filePath != '') */ { var flag = false; var fileType = filePath.substring(filePath.lastIndexOf(".")); var beginIndex = fileType if(fileTypes && fileTypes.length>0){ for (var i = 0; i if(fileTypes[i]==fileType){ flag = true; break; } } } if (!flag) { alert('不接受'+fileType+'文件类型上传'); $('#addFfile').textbox('setValue', ''); return; } } }
新增销售合同详情信息SalesDetailsController
在新增销售合同详情信息SalesDetailsController
类的addSalesDetails
方法里面加个MultipartFile[] files
参数,然后获取到properties
配置文件里的上传路径,给salesDetails
设置随机ID
,循环传过来的文件,在循环的过程中。先判断文件里面是否有文件名 ,有的话就上传,给上传的附件设置随机ID ,把合同详情 的id
赋值给附件 的parentId
,再通过attachmentdao.insertAtt(att)
;保存上传的附件
/** * 新增销售合同详情信息 * @param person * @param request * @return * @throws IOException */ @RequestMapping(value="/addSalesDetails",method= RequestMethod.POST) @ResponseBody public Map addSalesDetails(SalesDetails salesDetails,HttpServletRequest request,@RequestParam("file") MultipartFile[] files) throws IOException{ //获取登录人信息 User user= (User) request.getSession().getAttribute("user"); //日志类型,操作人,操作内容,操作人IP,操作方法 //financeSalesDetailsService.insertSysLog("新增",user.getTrueName(),"新增人员信息: "+financeSalesDetailsService.getName(),user.getLoginIp(),"/person/addPerson"); Map map = new HashMap(); String uploadDir = ConfigUtil.getConfig("upload.dir"); salesDetails.setId(UUID.randomUUID().toString().replaceAll("-", ""));for (MultipartFile file : files) {if (StringUtils.isNotBlank(file.getOriginalFilename())) { Attachment att = FileUpload.upload(file, uploadDir, "salesDetails"); att.setId(UUID.randomUUID().toString().replaceAll("-", "")); att.setParentId(salesDetails.getId()); attachmentdao.insertAtt(att); }else {continue; } } salesDetailsService.addSalesDetails(salesDetails, user);//新增人员信息return map; }
新增销售合同详情信息SalesDetailsServiceImpl
@Override public Map addSalesDetails(SalesDetails salesDetails, User user) { // salesDetails.setId(UUID.randomUUID().toString().replace("-", "")); salesDetails.setCreateName(user.getCreateName()); salesDetails.setCreateDate(new Date()); salesDetails.setDeleteFlag(CoreConst.NO_DEL);//删除标识 Map map = new HashMap();// String uploadDir = ConfigUtil.getConfig("upload.dir");try { salesDetailsDao.insSalesDetails(salesDetails); map.put("status", "200"); map.put("msg", "保存成功"); } catch (Exception e) { map.put("status", "400"); map.put("msg", "保存失败"); e.printStackTrace(); }return map; }
新增销售合同详情信息SalesDetailsDao
/** * 添加一条销售合同详情记录 */ int insSalesDetails(SalesDetails salesDetails);
思路:本来新增之后SalesDetailsMapper.xml
中的查询方法是销售合同表 ,销售合同详情表 ,附件表 三张表联查,然后再从里面拿单个字段 的,发现和附件表联查的时候,假如上传了两个或者三个文件 ,那么就会有两个或者三个一摸一样 的数据,原因就在于附件表的路径名称和文件名称不同 ,销售合同详情的id
是赋值给附件表的parentId
新增销售合同详情信息SalesDetailsMapper.xml的insSalesDetails方法
<insert id="insSalesDetails" parameterType="com.yhzn.model.finance.SalesDetails"> insert into FINANCIAL_SALES_DETALL <trim prefix="(" suffix=")" suffixOverrides=","> <if test="id != null"> ID, if> <if test="acceptId != null"> ACCEPT_ID, if> <if test="money != null"> MONEY, if> <if test="acceptMoney != null"> ACCEPT_MONEY, if> <if test="createName != null"> CREATE_NAME, if> <if test="createDate != null"> CREATE_DATE, if> <if test="modifyName != null"> MODIFY_NAME, if> <if test="modifyDate != null"> MODIFY_DATE, if> <if test="deleteFlag != null"> DELETE_FLAG, if> <if test="rev1 != null"> REV1, if> <if test="rev2 != null"> REV2, if> <if test="rev3 != null"> REV3, if> <if test="acceptDate != null"> ACCEPT_DATE, if> <if test="remark != null"> REMARK, if> trim> <trim prefix="values (" suffix=")" suffixOverrides=","> <if test="id != null"> #{id,jdbcType=VARCHAR}, if> <if test="acceptId != null"> #{acceptId,jdbcType=VARCHAR}, if> <if test="money != null"> #{money,jdbcType=DECIMAL}, if> <if test="acceptMoney != null"> #{acceptMoney,jdbcType=DECIMAL}, if> <if test="createName != null"> #{createName,jdbcType=VARCHAR}, if> <if test="createDate != null"> #{createDate,jdbcType=DATE}, if> <if test="modifyName != null"> #{modifyName,jdbcType=VARCHAR}, if> <if test="modifyDate != null"> #{modifyDate,jdbcType=DATE}, if> <if test="deleteFlag != null"> #{deleteFlag,jdbcType=DECIMAL}, if> <if test="rev1 != null"> #{rev1,jdbcType=VARCHAR}, if> <if test="rev2 != null"> #{rev2,jdbcType=VARCHAR}, if> <if test="rev3 != null"> #{rev3,jdbcType=VARCHAR}, if> <if test="acceptDate != null"> #{acceptDate,jdbcType=DATE}, if> <if test="remark != null"> #{remark,jdbcType=VARCHAR}, if> trim> insert>