1.
首先导入jquery-form.js 插件 ----> 用来提交表单
导入layer.css 以及 layer.js -----> 用来提醒用户(这是一个比较成熟的弹出层框架)
2.源代码
html部分:
<form enctype="multipart/form-data" id="resume_frm">
<div class="form-group has-success">
<label class="control-label" for="inputSuccess">姓名:</label>
<input type="text" class="form-control" id="inputSuccess" name="name">
</div>
<div class="form-group has-success">
<label class="control-label" for="inputSuccess">联系方式:</label>
<input type="text" class="form-control" id="inputSuccess" name="phone">
</div>
<span class="btn btn-success fileinput-button" style="margin-bottom:20px;">
<i class="glyphicon glyphicon-plus"></i>
<span>上传简历:</span>
<input id="fileupload" type="file" name="file" multiple>
</span>
<button type="button" class="btn btn-primary btn-lg btn-block">提交</button>
</form>
这里要注意的是enctype="multipart/form-data" 属性 ,表示二进制的方式提交表单
js部分:
$(function(){
$(".btn-block").click(function(){
$("#resume_frm").ajaxSubmit({
type:"post",
url:"/liaoyuan/recruit/addRecruitInformation.do",
dataType:"json",
success:function(data){
//墨绿深蓝风
layer.alert('提交成功,请耐心等候,我们会在一个工作日内回复您!', {
skin: 'layui-layer-molv' //样式类名
,closeBtn: 0
}); //end layer
} //end success
}); //end ajaxSubmit
}); //end click
});
后台 spring-mvc部分:
@Controller
@RequestMapping("/recruit")
public class RecruitController {
@RequestMapping("/addRecruitInformation")
public @ResponseBody boolean addRecruitInformation(HttpServletRequest request,@RequestParam("file")CommonsMultipartFile file,Recruit recruit){
String recruitdocument = "";
boolean status = false;
try {
//重命名文件名称
recruitdocument = String.valueOf(Calendar.getInstance().getTimeInMillis())
+ "." + file.getOriginalFilename().substring(file.getOriginalFilename().indexOf(".")+1,file.getOriginalFilename().length());
// 文件保存路径(带文件重构名)
String filePath = request.getSession().getServletContext().getRealPath("/") + "upload/recruit/" + recruitdocument;
recruit.setResume(filePath); //放入更名后的文件名
file.transferTo(new File(filePath));
} catch (Exception e) {
e.printStackTrace();
return status;
}
status = recruitService.addRecruitInformation(recruit);
return status;
}
@requestParam("xx") 相当于servlet中的request.getParameter() 而其中的属性就是表单中type="file" 里的name属性所对应的值,而其他属性 可以用对象来接受