easyui图片上传demo

最新推荐文章于 2024-04-18 11:26:54 发布

原创最新推荐文章于 2024-04-18 11:26:54 发布 · 4k 阅读

4 ·

CC 4.0 BY-SA版权

JAVA 同时被 2 个专栏收录

2 篇文章

订阅专栏

Easyui，easyui file

1 篇文章

订阅专栏

本文展示了一个使用EasyUI实现的JSP图片上传示例。通过一个简单的HTML表单和JavaScript函数SealSignatureInputImage，实现了点击上传按钮后，利用ajaxSubmit进行文件提交。当图片上传成功时，会显示系统提示消息。

JSP：

<form id="file_form" method="post" action="http://172.16.0.61:8080/Eagleflight/UploadImageAction/DdUpload.do"

enctype="multipart/form-data">


<img id="imgurl1" style="width:59px;height:22px" >
<div>

<input type="hidden" id="IsCheck1" name="IsCheck1">
<input name="file" data-options="onChange:function(){$('#IsCheck1').val(1)}" style="width: 150px;height:22px;" class="easyui-filebox" buttonText="选择图片"/>

</div>

</form>

aciton 自己理解吧，不难懂

@ResponseBody
@RequestMapping(value = "/DdUpload", method = { RequestMethod.POST})
public String DdUpload(final HttpServletRequest req, HttpServletResponse resp,
@RequestParam(value = "file") MultipartFile... files)
throws IOException, Exception {
//req.getParameter("one"), req.getParameter("two"),req.getParameter("three"),)
zlFinalUserImage zlFinalUserimage = new zlFinalUserImage();
zlFinalUserimage.setUserid(Integer.parseInt(req.getParameter("UserSealSignaturePaid")));
String filename = "";
if(files==null){
return "失败";
}
int i=0;
for (MultipartFile f : files) {
if (f.getSize() > 0) {
File targetFile = new File(req.getSession().getServletContext().getRealPath("/")+"sealsignature/"+f.getOriginalFilename());
filename += targetFile.getName()+",";
f.transferTo(targetFile);// 写入目标文件不要存入数据库的话下面的都可以不要

if(!req.getParameter("IsCheck1").equals("")&&i<1){
zlFinalUserimage.setCaactestisign(req.getParameter("Caacjy"));
zlFinalUserimage.setCaactestimage(targetFile.getName());
i=1;
continue;
}
if(!req.getParameter("IsCheck2").equals("")&&i<2){
zlFinalUserimage.setCaacrepairisign(req.getParameter("Caacxl"));
zlFinalUserimage.setCaacrepairimage(targetFile.getName());
i=2;
continue;
}
if(!req.getParameter("IsCheck3").equals("")&&i<3){
zlFinalUserimage.setCaacreleaseisign(req.getParameter("Caacfx"));
zlFinalUserimage.setCaacreleaseimage(targetFile.getName());
i=3;
continue;
}
if(!req.getParameter("IsCheck4").equals("")&&i<4){
zlFinalUserimage.setDatamanagersign(targetFile.getName());
i=4;
continue;
}
if(!req.getParameter("IsCheck5").equals("")&&i<5){
zlFinalUserimage.setFaatestsign(req.getParameter("Faajy"));
zlFinalUserimage.setFaatestimage(targetFile.getName());
i=5;
continue;
}
if(!req.getParameter("IsCheck6").equals("")&&i<6){
zlFinalUserimage.setFaarepairsign(req.getParameter("Faaxl"));
zlFinalUserimage.setFaarepairimage(targetFile.getName());
i=6;
continue;
}
if(!req.getParameter("IsCheck7").equals("")&&i<7){
zlFinalUserimage.setFaareleasesign(req.getParameter("Faafx"));
zlFinalUserimage.setFaareleaseimage(targetFile.getName());
i=7;
continue;
}
if(!req.getParameter("IsCheck8").equals("")&&i<8){
zlFinalUserimage.setProductionschedulingimage(targetFile.getName());
i=8;
continue;
}
if(!req.getParameter("IsCheck9").equals("")&&i<9){
zlFinalUserimage.setAutograph(targetFile.getName());
i=9;
continue;
}
}
}
if(UploadImageActionservice.Imgmanage(zlFinalUserimage)<0){
return "新增失败";
}
return filename;
}

js:

function SealSignatureInputImage(){
$('#file_form').ajaxSubmit({
dataType : 'json',
success : function(data) {

//这里你可以当成ajax用，解决的表单刷新问题
if(data!="新增失败"){
$.messager.show({
title:'系统提示',
msg:'上传个人所属图片成功。',
showType:'slide'
});

}