java jfinal + ajaxfileupload.js 上传
功能上传
需求:同时上传多张图片
前端:jquery.ajaxfileupload.js
后端:jfinal
upload.htm
<html>
<body>
<div class="form-element-file-wapper">
<button type="button">上传照片</button>
<input type="file" id="image0" name="image" accept="image/jpeg,image/png,image/gif">
</div>
<script>
//绑定6个按钮控件
$(document).ready(function(){
var arr = [0,1,2,3,4,5];
$(arr).each(function(index,element){
$("#image0").ajaxfileupload({
'action': '/upload/uploadImage',
'onComplete': function(data) {
var html ="";
html += "<img alt='' src='"+data.filepath+"'>";
var name = "img"+$.trim(index);
html += "<input type='hidden' name="+name+" value='"+data.filepath+"'>";
$("#img"+index).html(html);
},
'onStart': function() {
},
'onCancel': function() {
},
valid_extensions:['jpeg','png','gif','jpg']
});
});
});
</script>
</html>
</body>
一、新增
Upload.java
public void uploadImage(){
UUID uuid = UUID.randomUUID();
String sysPath = getSession().getServletContext().getRealPath("");
File tempFile = new File(sysPath+"/upload/temp/");
if(!tempFile.exists()){
tempFile.mkdirs();
}
UploadFile upfile = getFile("image");
if(upfile != null){
File file = upfile.getFile();
String fileName = uuid+"_"+file.getName();
String filepath = "/upload/temp/"+fileName;
file.renameTo(new File(sysPath+filepath));
setAttr("filepath", filepath); //返回文件存放临时路径给前台
}
renderJson();
}
//保存文件和做相关业务
public void saveUploadImage(String filepath[],Business business){
String sysPath = getSession().getServletContext().getRealPath("");
File savepath = new File(sysPath+"/upload/image/");
if(!savepath.exists()){
savepath.mkdirs();
}
for(int i=0;i<filepath.length;i++){
File file = new File(sysPath+filepath[i]);
if(!file.exists()){
continue;
}
file.renameTo(new File(savepath+File.separator+file.getName()));
System.out.println(new File(savepath+File.separator+file.getName()).getAbsolutePath());
business.set("id","business_seq.nextval");
//其它字段...
business.set("head_img"+(i+1), "/upload/image/"+file.getName());
business.save();
}
}
二、更新
public void UpdateUploadImage(){
UUID uuid = UUID.randomUUID();
String sysPath = getSession().getServletContext().getRealPath("");
File savepath = new File(sysPath+"/upload/image/");
if(!savepath.exists()){
savepath.mkdirs();
}
UploadFile upfile = getFile("image");
if(upfile == null){
return;
}
Integer seq = getParaToInt("seq")+1;
Long businessId = getParaToLong("businessId");
//删除原来文件
Record record = BusinessService.findById(businessId);
String head_img = record.get("head_img"+seq);
if(head_img!=null && !"".equals(head_img)){
File f = new File(sysPath+head_img);
if(f.exists()){
f.delete();
}
}
//保存新文件路径
File file = upfile.getFile();
String fileName = uuid+"_"+file.getName();
String filepath = "/upload/student_store_image/"+fileName;
file.renameTo(new File(sysPath+filepath));
//更新数据库
Business business= new Business();
business.set("id", studentStoreId);
business.set("head_img"+seq, filepath);
business.update();
setAttr("filepath", filepath);
renderJson();
}
注释:
1、新增业务:先把图片存放在服务器的临时目录,待用户所有资料填完点击提交。保存资料和一次保存6张图片。
2、更新业务:直接保存图片到服务器目录,而且更新数据库记录,记录图片的目录位置。
3、新增:一次性提交所有form表单数据,当然包括图片。 更新:多次提交,普通表单数据的提交/数据文件的提交。
java jfinal + ajaxfileupload.js 上传的更多相关文章
- 使用ajaxfileupload.js上传文件
一直以来上传文件都是使用form表单上传文件,也看到过有人使用js上传文件,不过看起来蛮简单的也就没有怎么去理会.今天突然要使用这种方式上传文件,期间还遇到点问题.因此就记录下来,方便以后遇到这样的问 ...
- ajaxfileupload.js上传文件兼容IE7及以上版本
要兼容IE789,要修改ajaxfileupload.js;要将此处的代码替换掉 if(window.ActiveXObject) { var io = document.createElement( ...
- jquery插件--ajaxfileupload.js上传文件原理分析
英文注解应该是原作者写的吧~说实话,有些if判断里的东西我也没太弄明白,但是大致思路还是OK的. jQuery.extend({ createUploadIframe: function (id, u ...
- 【转】JQuery插件ajaxFileUpload 异步上传文件(PHP版)
前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...
- js 上传下载(留着备用)
js 上传下载(留着备用) 下载文件 1. <a href="#" onClick="download()">下载文件</a> & ...
- js上传文件带参数,并且,返回给前台文件路径,解析上传的xml文件,存储到数据库中
ajaxfileupload.js jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId ...
- JQuery插件ajaxFileUpload 异步上传文件(PHP版)
太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错 ...
- MVC+AjaxFileUpload文件上传
来源:微信公众号CodeL 本次给大家分享的是ajaxfileupload文件上传插件,百度一大堆功能超炫的文件上传插件,为什么我们会选择这个插件呢? 原因是在此之前,我们尝试使用过很多基于flash ...
- 【原创】用JAVA实现大文件上传及显示进度信息
用JAVA实现大文件上传及显示进度信息 ---解析HTTP MultiPart协议 (本文提供全部源码下载,请访问 https://github.com/grayprince/UploadBigFil ...
随机推荐
- IOS文件管理-NSFileMangager-NSdata
Ios下的文件管理, Ios下不像windows 文件系统那样可以访问任何的文件目录,如C盘.D盘什么的.在Ios中每个应用程序只能访问当前程序的目录,也即sandbox(沙盒模型). iOS为每个应 ...
- uitabbarcontroller中 在设置tab bar item的image属性后不显示问题
开始使用ios中的UITabBarController,在给Tab Bar Item设置自定义图片的时候,遇到了问题 按照如下配置: 出来的结果确是: 实际上test24.png应该是: 纠结了很久, ...
- setLayoutParams getLayoutParams
继承关系:java.lang.Object ↳ android.view.ViewGroup.LayoutParams ↳ android.view.ViewGroup.MarginLayoutPar ...
- cometd的服务器配置
CometDServlet必须在web.xml中进行配置,如下: <servlet> <servlet-name>cometd</servlet-name& ...
- resolve some fragment exception
1.android fragment not attached to activity http://blog.csdn.net/walker02/article/details/7995407 if ...
- hdu 2064
ps:分析发现,要移动n个到最左端,首先要移动n-1个从A到C,然后从C到A,然后再从A到C,然后中间是把大盘从A到C,两步.递推公式自然就是a[n]=3*a[n-1]+2 代码: #include ...
- Hadoop MRUnit使用(一)
之前在写MR job的时候,由于要在云梯,或者一淘的开发集群上运行:所以处理方法是,在本地打成jar包,然后scp到客户端网关机上,然后在提交job运行.这样的问题时,有时候如果遇到一些逻辑上的问题, ...
- VS2013 JS 跟踪
VS2013JS 跟踪 1.在页面对应的cs文件中设置断点,F10单步执行. 2.单步执行调试会自然而然执行到JS里面.
- 【题解】【BT】【Leetcode】Populating Next Right Pointers in Each Node
Given a binary tree struct TreeLinkNode { TreeLinkNode *left; TreeLinkNode *right; TreeLinkNode *nex ...
- Oracle SQL语句追踪
Oracle SQL语句追踪 1 SQL语句追踪 追踪SQL语句的执行过程需要在Oracle服务器端进行,Oracle服务器端会检测并记录访问进程所执行的所有SQL语句.下面使用的命令都是在命令行 ...