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实现上传文件的更多相关文章

  1. Ajax方式上传文件

    用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 For ...

  2. koa2:通过Ajax方式上传文件,使用FormData进行Ajax请求

    koa2通过表单上传的网上很多,但通过Ajax方式上传文件,使用FormData进行Ajax请求,不好找. 参考了这个用base64上传图片的例子.https://github.com/Yuki-Mi ...

  3. (23)ajax实现上传文件的功能

    form表单上传文件 urls.py from django.conf.urls import urlfrom django.contrib import adminfrom app01 import ...

  4. SSM框架下,使用ajax请求上传文件(doc\docx\excel\图片等)

    1.准备工作 1.1.添加上传必要jar包 <dependency> <groupId>commons-io</groupId> <artifactId> ...

  5. ajax异步上传文件和表单同步上传文件 的区别

    1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...

  6. ajax如何上传文件(整理)

    ajax如何上传文件(整理) 一.总结 一句话总结:用FormData,FormData+ajax=异步上传二进制文件 <form enctype="multipart/form-da ...

  7. django中通过文件和Ajax来上传文件

    一.通过form表单来上传文件 1.在html模板中 <form action="/index/" method="post" enctype=" ...

  8. 基于Flask开发网站 -- 前端Ajax异步上传文件到后台

    大家好,我是辰哥~ 辰哥最近利用空闲时间在写一个在线可视化平台,过程中也觉得一些技术还是比较有意思的,所以就以模块化的形式分享出来.如:从网页界面(前端)上传文件到服务器(后端). 放一下该模块的界面 ...

  9. 通过Ajax方式上传文件,使用FormData进行Ajax请求

    通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...

随机推荐

  1. liunux 修改hostname

    最近鼓捣Oracle,记录些技巧 修改hostname # vim /ect/hosts # vim /etc/sysconfig/network 修改hostname # service netwo ...

  2. Angular 单元格合并

    在Angular实现表格输出的话,使用ng-repeat输出信息, 使用了: ng-repeat-start ng-repeat-end ng-hide="$first" < ...

  3. React-native之Alert

    普通的alert 先看函数原型 alert: (title: string, message?: string, buttons?: AlertButton[], type?: string) =&g ...

  4. JS中检测数据类型的几种方式及优缺点【转】

    1.typeof 用来检测数据类型的运算符 typeof value 返回值首先是一个字符串,其次里面包含了对应的数据类型,例如:"number"."string&quo ...

  5. sql 更新列表中最老的一条数据

    今天组长给个任务说要给摄像头触发一个列表.让缓存5条数据,每次摄像头触发更新一条,丢掉最老的一条数据.原来的update是直接更新掉一条,没带缓存的.然后搞了个sql语句,是这样的: UPDATE C ...

  6. HTTP协议详解(转)

    转自:http://blog.csdn.net/gueter/archive/2007/03/08/1524447.aspx Author :Jeffrey 引言 HTTP是一个属于应用层的面向对象的 ...

  7. Kafka使用入门教程

    转载自http://www.linuxidc.com/Linux/2014-07/104470.htm 介绍 Kafka是一个分布式的.可分区的.可复制的消息系统.它提供了普通消息系统的功能,但具有自 ...

  8. WIM镜像添加多语言支持

    起初的想法: intel 600p虽然速度一般,但pcie还是值得一试的.购买后发现原来的win7版本无法识别就找了KB2990941和KB3087873两个补丁,成功识别出了硬盘.期间通过dezor ...

  9. VS 默认开发环境如何更改

    话不多说,直接上图

  10. svg格式的中国地图轮廓图

    <?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C ...