【知识积累】表单异步提交（文件上传）

最新推荐文章于 2022-08-31 08:00:58 发布

Darren Gong

最新推荐文章于 2022-08-31 08:00:58 发布

阅读量192

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/axin1240101543/article/details/87182021

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

一、jquery.form.js

1、下载地址：

https://download.csdn.net/download/axin1240101543/10955452

2、使用

2.1、js代码

<script type="text/javascript" src="../js/jquery.form.js"></script>
<script type="text/javascript">
function sendMsg_file(){
            var msg = $("#msg_file").val();
            var msgFlag = checkContent(msg);
            if(msgFlag){
                if (confirm("确认发送？")) {
                    var options = {
                        url : 'telMassSendMsg.html',
                        type: 'post',
                        dataType: 'json',
                        success:function (data) {
                            if (data.code == 0) {
                                alert(data.msg);
                                window.location.reload();
                            } else {
                                alert(data.msg);
                            }
                        }
                    };
                    $("#telMassSendMsg_file").ajaxSubmit(options);
                }
            }
		}
</script>

2.2、html

<div id="portlet_tab2" class="tab-pane active">
						<div class="accordion">
							<form id="telMassSendMsg_file" action="telMassSendMsg.html" method="post" enctype="multipart/form-data" class="tab-pane">
								<table  style="margin:12px auto;width:90%;" class="table2">
									<tr>
										<th width="18%" class="f16 th-tel1" style="vertical-align: top;">上传联系人：</th>
										<td align="left">
											<a style="width: 15%;margin-bottom: 29px;" href="javascript:;" class="file"><span>未选择任何文件</span><input style="display: inline-block;float: left;" type="file" id="file1" name="file1" onchange="validate_img(this)" multiple></a>
										</td>
									</tr>
									<tr>
										<th width="18%" class="f16 th-tel2">短信内容：</th>
										<td align="left" >
											<div class="control-group success">
												<textarea rows="8"  class="input-td palette-night"  style="width: 80%; margin-bottom: 0px;margin-top: 40px;" id="msg_file" name="msg"></textarea>
											</div>
										</td>
									</tr>
									<tr>
										<td colspan="6"><button type="button" class="btn btn-primary" onclick="sendMsg_file()"><i class="icon-rss"></i> 发送</button></td>
									</tr>
								</table>
							</form>
						</div>
					</div>

2.3、web代码

    @RequestMapping(value="/telMassSendMsg")
    @ResponseBody
	public BaseVo telMassSendMsg(HttpServletRequest request, String tels, String msg){
        BaseVo baseVo = new BaseVo();
        MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest)request;
        MultiValueMap<String, MultipartFile> multiValueMap = multipartHttpServletRequest.getMultiFileMap();
        if (!multiValueMap.isEmpty() && StringUtils.isBlank(tels)){
            MultipartFile multipartFile = null;
            for (MultiValueMap.Entry<String, List<MultipartFile>> map: multiValueMap.entrySet()) {
                List<MultipartFile> files = map.getValue();
                multipartFile = files.get(0);
            }
            List<MsgVo> msgList = null;
            try {
                msgList = ExcelUtils.readExcel2Obj(MsgVo.class, 1, 2, multipartFile.getInputStream());
            } catch (IOException e) {
                log.error("读取Excel文件失败");
                baseVo.setCode(WebStatusEnums.FAILURE.getCode());
                baseVo.setMsg("读取Excel文件失败");
                return baseVo;
            }
            if (CollectionUtils.isNotEmpty(msgList)){
                StringBuilder sb = new StringBuilder();
                for (MsgVo m:msgList){
                    sb.append(m.getTelephone()).append(",");
                }
                tels = sb.toString().substring(0, sb.toString().length() - 1);
            }

        }
        if (StringUtils.isBlank(tels)){
            baseVo.setCode(WebStatusEnums.FAILURE.getCode());
            baseVo.setMsg("手机号不能为空");
            return baseVo;
        }
        //替换中文逗号，去除前后空格
        tels = tels.replace("，", ",").trim();
        String[] telArr = tels.split(",");
        for (String str:telArr){
            str = str.trim();
            boolean b = Pattern.compile(FORMAL).matcher(str).matches();
            if (!b){
                baseVo.setCode(WebStatusEnums.FAILURE.getCode());
                baseVo.setMsg(new StringBuilder("手机号:").append(str).append("不合法").toString());
                return baseVo;
            }
        }
        //返回0是成功
        ResultBean rb = customer.telSendMsg(telArr, msg);
        baseVo.setCode(rb.getCode());
        baseVo.setMsg(rb.getMsg());
        return baseVo;
    }