<form method="post" enctype="multipart/form-data" id="resource">
<table border="1" width="100%" >
<th colspan="3">资源上传</th>
<tr height="28px">
<td width="12%" align="right">文 件 名:</td>
<td width="68%" >
<input class="zxui-textbox" style="width:300px" id="title">
</td>
<td rowspan="3">
<div style="height: 380px">
<input type="file" name="files"><br>
</div>
</td>
</tr>
<tr height="28px">
<td width="12%" align="right">文件类型:</td>
<td width="68%" >
<select id="cc" class="zxui-combobox" name="dept" style="width:200px;">
<option value="0">书籍</option>
<option value="1">音频</option>
<option value="2">视频</option>
</select>
</td>
</tr>
<tr height="28px">
<td width="12%" align="right">备 注:</td>
<td width="68%" >
<input class="zxui-textbox" style="width:300px" id="remark">
</td>
</tr>
<tr height="28px">
<td width="100%" colspan="3" align="center">
<a id="fileUpload" onclick="subResource()" class="zxui-linkbutton" data-options="iconCls:'downloadIcon'">上传</a> </td>
</tr>
</table>
</form>

  js:

function subResource(){
var remark=$('#remark').val();
var title=$('#title').val();
var files = $('#files').val(); //调用apicontroller后台action方法,将form数据传递给后台处理。contentType必须设置为false,否则chrome和firefox不兼容
if (files != ''& remark != '' & title != '') {
var formData = new FormData($("#resource")[0]);
formData.append("remark",remark);
formData.append("title",title); $.ajax({
url: "..../resources/upload.pt",
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (returnInfo) {
if (returnInfo==true) {
$.messager.alert('提示:','上传成功!');
$('#fileUpload').linkbutton('disable');
} else {
$.messager.alert('提示:','上传失败!请重新上传!');
}
},
error: function (returnInfo) {
//上传失败时显示上传失败信息
//document.getElementById('uploadInfo').innerHTML = "<span style='color:Red'>" + returnInfo + "</span>";
}
});
} else {
$.messager.alert('提示:','请完善上传资源或信息!');
}
}

  后台:

	@RequestMapping("upload")
@ResponseBody
public boolean upload(MultipartFile files,String remark,String title) throws Exception, IOException{
MultipartFile ufile=files;
String oname=ufile.getOriginalFilename();
String name=ufile.getName();
ServletContext context=this.getRequest().getSession().getServletContext();
String realname=context.getRealPath("/upload");
File nfile=new File(realname+"/"+UUID.randomUUID().toString()+oname);
ufile.transferTo(nfile); Dmp dmp =new BaseDmp();
String id = CodeUtil.getTimeSequence(30);
UserInfo user = this.getUserInfo();
String userid = user.getUserid();
String usname = user.getUsername();
dmp.put("id", id);
dmp.put("creater", usname);
dmp.put("createrid", userid);
dmp.put("address", String.valueOf(nfile));
dmp.put("remark", remark);
dmp.put("title", title);
int i =reService.in_resources(dmp);
boolean bo = false;
if (i>0) {
bo = true;
}
return bo;
}

  

form enctype="multipart/form-data" ajax 文件上传的更多相关文章

  1. 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html

    使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },&qu ...

  2. 使用ajax提交form表单,包括ajax文件上传【转载】

    [使用ajax提交form表单,包括ajax文件上传] 前言 转载:作者:https://www.cnblogs.com/zhuxiaojie/p/4783939.html 使用ajax请求数据,很多 ...

  3. 使用ajax提交form表单,包括ajax文件上传

    前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的aja ...

  4. Ajax(form表单文件上传、请求头之contentType、Ajax传递json数据、Ajax文件上传)

    form表单文件上传 上菜 file_put.html <form action="" method="post" enctype="multi ...

  5. jquery.form.js官方插件介绍Form插件,支持Ajax,支持Ajax文件上传

    jquery.form.js官方插件介绍Form插件,支持Ajax,支持Ajax文件上传 http://www.malsup.com/jquery/form/#getting-started [JQu ...

  6. AJAX文件上传实践与分析,带HTML5文件上传API。

    对于HTML5已经支持AJAX文件上传了,但如果需要兼容的话还是得用一点小技巧的,HTML5等等介绍,先来看看以前我们是怎么写的. 网上可能会有一些叫AJAX文件上传插件,但在AJAX2.0之前是不可 ...

  7. 兼容ie的jquery ajax文件上传

    Ajax文件上传插件很多,但兼容性各不一样,许多是对ie不兼容的,另外项目中是要求将网页内容嵌入到桌面端应用的,这样就不允许带flash的上传插件了,如:jquery uploadify...悲剧 对 ...

  8. 转: 如何实现jQuery的Ajax文件上传

    [PHP文件上传] 在开始之前,我觉得是有必要把通WEB上传文件的原理简单说一下的.实际上,在这里不管是PHP,JSP,还是ASP处理上传的文件,其实都是WEB早已把文件上传到服务器了,我们只是运用上 ...

  9. springmvc+ajax文件上传

    环境:JDK6以上,这里我是用JDK8,mysql57,maven项目 框架环境:spring+springmvc+mybaits或spring+springmvc+mybatis plus 前端代码 ...

  10. 表单文件上传,ajax文件上传

    原创链接:http://www.cnblogs.com/yanqin/p/5345562.html html代码  index.jsp(表单文件上传) <form action="sh ...

随机推荐

  1. flink-cdc实时同步mysql数据到elasticsearch

    本文首发于我的个人博客网站 等待下一个秋-Flink 什么是CDC? CDC是(Change Data Capture 变更数据获取)的简称.核心思想是,监测并捕获数据库的变动(包括数据 或 数据表的 ...

  2. OKR之剑(理念篇)01—— OKR带给我们的改变

    作者:vivo互联网平台产品研发团队 一.前言 OKR即目标与关键成果法,起源于英特尔,在谷歌发扬光大.近几年在国内比较火,很多企业都相继引入了OKR的管理方式,小到2-3人的小微初创公司,大到十几万 ...

  3. 第二章:视图层 - 9:动态生成CSV文件

    CSV (Comma Separated Values),以纯文本形式存储数字和文本数据的存储方式.纯文本意味着该文件是一个字符序列,不含必须像二进制数字那样的数据.CSV文件由任意数目的记录组成,记 ...

  4. Jenkins忘记管理员密码怎么办

    一.admin密码未更改情况 1.进入/root/.jenkins/secrets/目录,打开initialAdminPassword文件,复制密码: 2.访问Jenkins页面,输入管理员admin ...

  5. MongoDB 副本集的用户和权限一般操作步骤

    步骤总结: 在主节点上添加超管用户,副本集会自动同步 按照仲裁者.副本节点.主节点的先后顺序关闭所有节点服务 创建副本集认证的key文件,复制到每个服务所在目录 修改每个服务的配置文件,增加参数 启动 ...

  6. day44-反射03

    Java反射03 3.通过反射获取类的结构信息 3.1java.lang.Class类 getName:获取全类名 getSimpleName:获取简单类名 getFields:获取所有public修 ...

  7. nsis插件nsisSlideshow.dll更新

    更新至1.7版本,作者wiz0u已解决关于ie9的兼容问题.Good 下载地址: http://wiz0u.free.fr/prog/nsisSlideshow/latest.php

  8. PyCharm安装PyQt5及其工具(Qt Designer、PyUIC、PyRcc)详细教程

    摘要:Qt是常用的用户界面设计工具,而在Python中则使用PyQt这一工具包,它是Python编程语言和Qt库的成功融合.这篇博文通过图文详细介绍在PyCharm中如何完整优雅地安装配置PyQt5的 ...

  9. Spring Boot 配置 jar 包外面的 Properties 配置文件

    一.概述 Properties 文件是我们可以用来存储项目特定信息的常用方法.理想情况下,我们应该将其保留在 jar 包之外,以便能够根据需要对配置进行更改. 在这个教程中,我们将研究在 Spring ...

  10. python-D1-typora软件和计算机入门1

    一 typora软件 typora是一款目前非常火爆文本编辑器 1.1 安装 尽量安装在非系统盘符及设置为短路径,方便后面查找 1.2 文件路径 在计算机上就是一个资源的定位坐标,表现为具体在哪里,例 ...