ajax 异步 提交 含文件的表单
1.前言
需求是使用 jquery 的 ajax 异步提交表单,当然,不是简单的数据,而是包含文件数据的表单。于是我想到了 new FormData() 的用法,
可是仍然提交失败,原来是ajax的属性需要修改才可以
【同步在form标签 添加几个属性即可,这里就不解释了】
2.前端表单源码,【同时上传多文件,name属性要相同后台才可以以数组的形式获取】
1 <form id="myform">
2 <input type="file" name="fi">
3 <input type="file" name="fi">
//按钮部分省略
//
4 </form>
3.js 的 ajax写法源码 ,红色箭头代码是关键

4.后台接收文件数组截图 ,变量名称一定要与form表单的文件input 的name属性值 一致

5 . MultipartFile 和 CommonsMultipartFile 类型的区别
其实 MultipartFile 是接口名称 ,CommonsMultipartFile是 接口 MultipartFile 的具体实现类 ,因此 ,使用 CommonsMultipartFile必须定义参数名称 ,
前面需要加 @Param("参数名称") ,
看起来很冗余 , 因此使用接口 MultipartFile 是最简洁的 , 加 【】则表示是数组型 ,用for循环遍历即可取出每一个
ajax 异步 提交 含文件的表单的更多相关文章
- ajax异步上传文件和表单同步上传文件 的区别
1. 用表单上传文件(以照片为例)-同步上传 html部分代码:这里请求地址index.php <!DOCTYPE html> <html lang="en"&g ...
- ASP.NET MVC 网站开发总结(五)——Ajax异步提交表单之检查验证码
首先提出一个问题:在做网站开发的时候,用到了验证码来防止恶意提交表单,那么要如何实现当验证码错误时,只是刷新一下验证码,而其它填写的信息不改变? 先说一下为什么有这个需求:以提交注册信息页面为例,一般 ...
- ajax方式提交带文件上传的表单,上传后不跳转
ajax方式提交带文件上传的表单 一般的表单都是通过ajax方式提交,所以碰到带文件上传的表单就比较麻烦.基本原理就是在页面增加一个隐藏iframe,然后通过ajax提交除文件之外的表单数据,在表单数 ...
- ajax+FormData+javascript实现无刷新表单信息提交
ajax+FormData+javascript实现无刷新表单信息提交 原理: dom收集表单信息,利用FormData快速收集表单信息 ,实例化表单数据对象 同时收集fm的表单域信息. var f ...
- jQuery选取所有复选框被选中的值并用Ajax异步提交数据
昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...
- jQuery.form.js jQuery ajax异步提交form
jQuery.form.js是一个form插件,支持ajax表单提交和ajax文件上传. 官网下载地址:http://plugins.jquery.com/form/ API ajaxForm 增加所 ...
- 为什么上传文件的表单里要加个属性enctype
为什么上传文件的表单里要加个属性enctype 上传文件的表单中<form>要加属性enctype="multipart/form-data",很多人只是死记硬背知道上 ...
- ajax+FormData+javascript 实现无刷新表单注册
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- AJAX异步提交,浏览器总跳出下载界面
问题: 我在写一个网页的“用户登录”部分时,要将用户名和密码传到后端验证,想在前端用了AJAX异步提交功能,将 用户名密码传到后端,然后后端返回验证结果.但AJAX写好后每次刷新网页都会跳出下载窗口, ...
随机推荐
- 分布式全局ID生成器原理剖析及非常齐全开源方案应用示例
为何需要分布式ID生成器 **本人博客网站 **IT小神 www.itxiaoshen.com **拿我们系统常用Mysql数据库来说,在之前的单体架构基本是单库结构,每个业务表的ID一般从1增,通过 ...
- VS 2019 调试 Asp.net WebApi 失败:ID为xx的进程当前未运行
概述 解决方案 用记事本或者其他文本编辑器,从文件夹中打开启动项项目下的 .csproj 文件: 删除节点 WebProjectProperties 内的所有代码: 保存后,VS会提示全部重新加载项目 ...
- 可视报表(Project)
<Project2016 企业项目管理实践>张会斌 董方好 编著 原来一直有一个执念,做项目的人电脑上一定要安装Project软件,今天突然知道了,原来领导的电脑上,可以不装,因为,Pro ...
- Mac终端学习C笔记
Mac终端自带Clang,是一个C语言.C++.Objective-C语言的轻量级编译器,也可以进行c程序编译.具体Clang和gcc区别不做详细介绍. 终端自动vi编辑器. 终端命令笔记: gcc ...
- LuoguP7019 [NWRRC2017]Auxiliary Project 题解
Update \(\texttt{2021.6.24}\) 修改了一处格式上的错误和一处笔误. Content 已知用 LED 灯来显示 \(0\sim9\) 这十个数字分别需要 \(6,2,5,5, ...
- 10分钟快速上车短视频风口:基于uniapp框架创建自己的仿抖音短视APP
在今年也就是第48次发布的<中国互联网络发展状况统计报告>有这样一个数据,21年的上半年以来,我国我国网民规模达10.11亿,其中短视频用户达8.88亿.碎片化的生活场景下,短视频成为人们 ...
- win10修改Docker Desktop Installer的默认安装目录
Docker Desktop Installer软件默认安装会装在C:\Program Files\Docker的目录下,默认是不能修改的,但是我们可以通过设置软链接的方式把安装默认弄到其他盘 我们先 ...
- Linux使用SCP命令不使用密钥直接进行远程复制(SSH免密登录)
假设A服务器要把文件复制到B服务器上 首先我们要在A服务器上生成密钥对 参考:https://www.cnblogs.com/pxblog/p/14396409.html 然后在把生成的密钥公钥id_ ...
- JAVA实现调用默认浏览器打开网页
/** * @title 使用默认浏览器打开 * @param url 要打开的网址 */ private static void browse2(String url) throws Excepti ...
- 【Tools】VS搭建Qt开发环境
00. 目录 @ 目录 00. 目录 01. 概述 02. Visual Studio 2019安装 03. Qt6安装 04. qt-vsaddin插件下载 05. qt-vsaddin插件安装 0 ...