ajax实现上传文件
1.html部分
<input style="width: 280px" type="file" name="upLoadProjectPlan" id="upLoadProjectPlan"
value="<%=taskAppend.getTaskAllocationDoc()%>"/> <a style="float: right; margin-right: 40px" class="button" href="javascript:void(0)"
onclick="UpladFile('upLoadProjectPlan', '<%=task.getTaskid() %>')"><span>上传</span></a>
2.js中利用ajax产生表单并发送表单
function UpladFile(fileUploadId, taskid) {
var fileObj = document.getElementById(fileUploadId).files[0]; // 获取文件对象
var FileController = "updateWorkAction!fileUpload"; // 接收上传文件的后台处理程序地址
// FormData 对象
var form = new FormData();
//form.append("author", "hooyes"); // 可以增加表单数据
form.append("taskid", taskid);
form.append("file", fileObj); // 文件对象
// XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
xhr.open("post", FileController, true);
xhr.onload = function () {
location.reload(true);
alert("上传完成!");
};
xhr.send(form);
}
3.Action部分
public class UpdateWorkAction extends ActionSupport{
private DistributeDao distributeDao;
private String taskid;
private List<File> file; // 上传的文件
private List<String> fileFileName; // 文件名称
private List<String> fileContentType; // 文件类型
public DistributeDao getDistributeDao() {
return distributeDao;
}
public void setDistributeDao(DistributeDao distributeDao) {
this.distributeDao = distributeDao;
}
public List<File> getFile() {
return file;
}
public void setFile(List<File> file) {
this.file = file;
}
public List<String> getFileFileName() {
return fileFileName;
}
public void setFileFileName(List<String> fileFileName) {
this.fileFileName = fileFileName;
}
public List<String> getFileContentType() {
return fileContentType;
}
public void setFileContentType(List<String> fileContentType) {
this.fileContentType = fileContentType;
}
private void init() throws UnsupportedEncodingException{
ServletActionContext.getRequest().setCharacterEncoding("UTF-8");
ServletContext context = ServletActionContext.getServletContext();
}
public String fileUpload() throws Exception{
init();
// 取得需要上传的文件数组
List<File> files = getFile();
if (files != null && files.size() > 0) {
for (int i = 0; i < files.size(); i++) {
FileOutputStream fos = new FileOutputStream(getSavePath() +
"\\" + getFileFileName().get(i));
FileInputStream fis = new FileInputStream(files.get(i));
byte[] buffer = new byte[1024];
int len = 0;
while ((len = fis.read(buffer)) > 0) {
fos.write(buffer, 0, len);
}
fis.close();
fos.close();
}
TaskAppend taskAppend = distributeDao.findLeaderMsg(Integer.parseInt(taskid));
taskAppend.setTaskAllocationDoc(getFileFileName().get(0));
distributeDao.updateTaskAppend(taskAppend);
}
return "fileUpload";
}
public String getTaskid() {
return taskid;
}
public void setTaskid(String taskid) {
this.taskid = taskid;
}
}
ajax实现上传文件的更多相关文章
- Ajax方式上传文件
用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 For ...
- koa2:通过Ajax方式上传文件,使用FormData进行Ajax请求
koa2通过表单上传的网上很多,但通过Ajax方式上传文件,使用FormData进行Ajax请求,不好找. 参考了这个用base64上传图片的例子.https://github.com/Yuki-Mi ...
- (23)ajax实现上传文件的功能
form表单上传文件 urls.py from django.conf.urls import urlfrom django.contrib import adminfrom app01 import ...
- SSM框架下,使用ajax请求上传文件(doc\docx\excel\图片等)
1.准备工作 1.1.添加上传必要jar包 <dependency> <groupId>commons-io</groupId> <artifactId> ...
- ajax异步上传文件和表单同步上传文件 的区别
1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...
- ajax如何上传文件(整理)
ajax如何上传文件(整理) 一.总结 一句话总结:用FormData,FormData+ajax=异步上传二进制文件 <form enctype="multipart/form-da ...
- django中通过文件和Ajax来上传文件
一.通过form表单来上传文件 1.在html模板中 <form action="/index/" method="post" enctype=" ...
- 基于Flask开发网站 -- 前端Ajax异步上传文件到后台
大家好,我是辰哥~ 辰哥最近利用空闲时间在写一个在线可视化平台,过程中也觉得一些技术还是比较有意思的,所以就以模块化的形式分享出来.如:从网页界面(前端)上传文件到服务器(后端). 放一下该模块的界面 ...
- 通过Ajax方式上传文件,使用FormData进行Ajax请求
通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...
随机推荐
- js判断图片是否加载完成
var img = new Image(); //新建一个图片对象:img.src = ...; //图片地址是你准备要加载的地址:if(img.complete){ //表示图片已经加载完成}
- 【签名之坑】Decmail.GetBits()
decimal类型有GetBits()方法 可以获取到值的int[4]值,进而获取到byte[16]值 在c#里,0m和0.00m获取到的byte[]是不一样的(具体为何不一样,自己百度) 在sql里 ...
- The Practical Guide to Empathy Maps: 10-Minute User Personas
That’s where the empathy map comes in. When created correctly, empathy maps serve as the perfect lea ...
- VIPM 发布功能总结
前言 上一篇中,我们分析介绍了LabVIEW自带的安装发布功能,今天总结一下VIPM的发布功能. VIPM 提到LabVIEW,不能不提VI Package Manager (VIPM)这个工具包 ...
- 关于ubuntu16.04中mysql root登陆不了的情况下(大多是未设置密码的情况)
1.先将当前用户改成 root用户:sudo su 2.进入安装路径,我的是:cd /etc/mysql/ 3.打开debian.cnf : gedit debian.cnf 4.找到:user pa ...
- Mysql 行列转换
一.第一种 原数据表 转换后 DROP TABLE IF EXISTS tempdynamic; CREATE TEMPORARY TABLE tempdynamic ( SELECT p.fsPay ...
- dereverberation
Typical Approach to Dereverberation DOAs Estimating the directions of arrival of a direct source sig ...
- 排序合并连接(sort merge join)的原理
排序合并连接(sort merge join)的原理 排序合并连接(sort merge join)的原理 排序合并连接(sort merge join) 访问次数:两张表都只会访 ...
- Asp.Net Core 发布和部署(Linux + Jexus )
前言 在上篇文章中,主要介绍了 Dotnet Core Run 命令,这篇文章主要是讲解如何在 asp.net core 中对我们的已经完成的程序进行发布和部署. 有关如何使用 Nginx 进行部署, ...
- DBImport v3.3 中文版发布:数据库数据互导及文档生成工具(IT人员必备)
前言: 好久没写文了, 距离上一篇文章是3个月前的事了,虽然工作很忙,主要还是缺少写作的内容和激情,所以没怎么动手. 之前有一个来月不断面试不同层次来应聘的人员,很有想写文的冲动,后来还是忍住了. 估 ...