form表单文件上传提交且接口回调显示提交成功
前端:
<form method="post" enctype="multipart/form-data" id="formSubmit">
<div class="row">
<div class="col-lg-12" style="padding-left:25px;padding-top: 5px">
<label>请选择文件</label>
<input type="file" name="file" title="点击选择文件" multiple="" accept="*/*" class="form-control">
</div>
</div>
<div class="row">
<div style="padding-left:25px;padding-top:10px">
<input type="submit" class="btn btn-primary">
</div>
</div>
</form>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
JS: $( '#formSubmit' ).submit( function (event) { //首先验证文件格式 var fileName = $( this ).find( "input[name=file]" ).val(); if (fileName === '' ) { alert( '请选择文件' ); return ; } // mulitipart form,如文件上传类 var formData = new FormData( this ); $.ajax({ async: false , type: "POST" , url: "/upload" , data: formData, dataType: "JSON" , mimeType: "multipart/form-data" , contentType: false , cache: false , processData: false , success: function (data) { if (data.success) { layer.alert( "上传成功" ) } else { layer.alert(data.error) } } }); return false ; }); |
js代码的最后需要return false 防止表单重复提交,刷新页面。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
java: @RequestMapping(value = "/upload" , method = RequestMethod.POST, produces = "application/json;charset=utf-8" ) @ResponseBody public SimpleAjaxResponse uploadSingleFile(HttpServletRequest request, Model model) { try { DefaultMultipartHttpServletRequest httpServletRequest = (DefaultMultipartHttpServletRequest) request; MultipartFile multipartFile = httpServletRequest.getFile( "file" ); return new SimpleAjaxResponse( true ); } catch (Exception e) { LOGGER.error(e.getMessage(), e); e.printStackTrace(); return new SimpleAjaxResponse( "上传出错了" ); } } |
form表单文件上传提交且接口回调显示提交成功的更多相关文章
- Ajax(form表单文件上传、请求头之contentType、Ajax传递json数据、Ajax文件上传)
form表单文件上传 上菜 file_put.html <form action="" method="post" enctype="multi ...
- SSM+form表单文件上传
这里介绍SSM如何配置上传文件 配置springmvc.xml: <!--配置上传下载--> <bean id="multipartResolver" class ...
- form表单文件上传 servlet文件接收
需要导入jar包 commons-fileupload-1.3.2.jar commons-io-2.5.jar Upload.Jsp代码 <%@ page language="jav ...
- 通过HttpClient4.5模拟Form表单文件上传
public static void main(String[] args) { CloseableHttpClient httpclient = HttpClients.createDefault( ...
- 基于Spring3 MVC实现基于form表单文件上传
http://blog.csdn.net/jia20003/article/details/8474374/
- Django---CBV和FBV的使用,CBV的流程,给视图加装饰器,Request对象方法,属性和Response对象,form表单的上传
Django---CBV和FBV的使用,CBV的流程,给视图加装饰器,Request请求对象方法,属性和Response响应对象,form表单的上传 一丶CBV和FBV 在Django中存 ...
- 表单文件上传,ajax文件上传
原创链接:http://www.cnblogs.com/yanqin/p/5345562.html html代码 index.jsp(表单文件上传) <form action="sh ...
- 混合表单文件上传到数据库(基于TOMCAT)
在实际的开发中在实现文件上传的同时肯定还有其他信息需要保存到数据库,就像混合表单在上传完毕之后需要将提交的基本信息插入数据库. 在这个demo中需要用到这个架包来帮助实现 1.定义一个公共类实现文件上 ...
- Ajax serialize()提交form表单不能上传file类型
前台form表单的提交方式有很多种,例如: 1. form表单submit直接提交的方法 2. Ajax提交的方法 3. jquery提交的方法 4. 原生js提交的方法 每一种方法都有它的优势和不足 ...
随机推荐
- docker-compose设置mysql初始化数据库的字符集
version: '3' services: mysql: image: mysql:5.7.24# volumes:# - ./mysqld.cnf:/etc/mysql/mysql.conf.d/ ...
- 3.kafka 基本配置
1.主题管理 kafka-topics.sh工具脚本用于对主题操作,如创建.删除.修改.分区数.副本数及主题级别的配置. 1.1创建名为kafka-test主题,有2个副本,3个分区 [hadoop@ ...
- 22,Django常用命令
学习Django你需要了解常见命令的使用,比如创建项目,创建应用,创建超级用户,数据表创建及更新,启动服务器等.这些命令都包含在django-admin.py和manage.py里.除此以外manag ...
- pandas数据处理
首先,数据加载 pandas提供了一些用于将表格型数据读取为DataFrame对象的函数,期中read_csv和read_table这两个使用最多. 1.删除重复元素 使用duplicated()函数 ...
- 【HICP Gauss】数据库 数据库高级语法(数据类型函数)-3
SQL高级语法:整型: integer 2(-31) ~2(31)-1 4字节 intger unsigned 2(0)~2(32)-1 4字节 bigint 2(-63)~2(63)-1 8字节 ...
- 资源管理与调度系统-资源管理系统Mesos
资源管理与调度系统-资源管理系统Mesos 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. Mesos是诞生于UC Berkeley的一个研究项目,它的设计动机是解决编程模型和计算框 ...
- 收起.NET程序的dll来
作为上床后需要下床检查好几次门关了没有的资深强迫症患者,有一个及其搞我的问题,就是dll问题. 曾几何时,在没有nuget的年代,当有依赖项需要引用的时候,只能通过文件引用来管理引用问题,版本问题,更 ...
- vbs查找Excel中的Sheet2工作表是否存在不存在新建
set oExcel = CreateObject( "Excel.Application" ) oExcel.Visible = false '4) 打开已存在的工作簿: oEx ...
- 黄杉杉 --java第七次作业
题目1:创建一个柱体类,包含矩形对象.高和体积等三个成员变量,一个构造方法进行成员变量初始化,和计算体积.换底两个功能方法,在主类中输入长.宽.高,计算柱体体积,输入新的长.宽.高,创建新的矩形对象, ...
- linux第三天
一.用户的类型 1.root管理员:所有权限(r w x) 2.文件拥有者(u):谁创建谁拥有 3.组 (g):用户组 4.其它用户(o):不属于用户组,也不是文件的创建者,不是管理员 ...