Ajax 提交form方式可以将form表单序列化 然后将数据通过data提交至后台,例如:



  1. $.ajax({


  2.      url : "http://localhost:8080/",


  3.      type : "POST",


  4.      data : $( '#postForm').serialize(),


  5.      success : function(data) {



  6.      },


  7.      error : function(data) {


  8.      }


  9. });

但是这种方式如果表单中有需要提交的文件类型 这样则不行 后台接不到数据。

解决办法:使用 FormData。这里使用jquery 最好使用2.0版本之后 之前应该不支持。例如:

<form id="form">

<P class="p5"><span><i>*</i>商户证书:</span>

<input type='text' name='apiclientType' id='textfield' class='w_txt' >

<input type='button' class='w_btn' value='上传证书' />

<input type="file" name="fileField" class="w_file" id="fileField" size="28" onchange="document.getElementById('textfield').value=this.value" />

</P>
</form>
var formData = new FormData(document.getElementById("form"));//表单id

$.ajax({

url: '${ctx}/wmManage/saveWeixinConfig.do' ,

type: 'POST',

data: formData,

async: false,

cache: false,

contentType: false,

processData: false,

success: function (result) {



}

});

附上后台数据接收:

@RequestMapping("/saveWeixinConfig")
@ResponseBody

public ResultMsg saveWeixinConfig(@RequestParam(value = "fileField",required = false)MultipartFile fileField) throws IOException {



return "";

}

通过Ajax提交form表单来提交上传文件的更多相关文章

  1. $_FILES参数详解及简单<form>表单无刷新上传文件

    $_FILES:经由 HTTP POST 文件上传而提交至脚本的变量,类似于旧数组$HTTP_POST_FILES 数组(依然有效,但反对使用)详细信息可参阅 POST方法上传 $_FILES数组内容 ...

  2. 利用 ajax自定义Form表单的提交方式

    需求场景:有时候单纯的form表单无法向后端传递额外的参数 比如需要action传递js异步生成的参数 ,form表单默认的action就无法满足需求,这时就需要我们自定义form表单的提交方式. h ...

  3. 4 django系列之HTML通过form标签来同时提交表单内容与上传文件

    preface 我们知道提交表单有2种方式,一种直接通过submit页面刷新方法来提交,另一种通过ajax异步局部刷新的方法提交,上回我们说了通过ajax来提交文件到后台,现在说说通过submit来提 ...

  4. php使用jquery Form ajax 提交表单,并上传文件

    在html5中我们通过FormData就可以ajax上传文件数据,不过因为兼容问题.我们选用jquery.form.min.js来进行ajax的表单提交.   一.jquery.form.js下载地址 ...

  5. FastAPI框架入门 基本使用, 模版渲染, form表单数据交互, 上传文件, 静态文件配置

    安装 pip install fastapi[all] pip install unicorn 基本使用(不能同时支持,get, post方法等要分开写) from fastapi import Fa ...

  6. jQuery Ajax 确定 form 表单 submit 提交成功

    使用 jQuery 提交表单,可以使用 同步方式(async: false). a.html 是 html 文件,a.php 是服务端文件,把 a.html 中表单的数据提交到 a.php 中,在提交 ...

  7. ajax提交form表单

    1. ajax提交form表单和不同的form表单的提交主要区别在于,ajax提交表单是异步提交的,而普通的是同步提交的表单. 2. from视图部分 <form id="loginF ...

  8. Jquery通过Ajax方式来提交Form表单

    今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...

  9. ajax提交form表单资料详细汇总

    一.ajax提交form表单和不同的form表单的提交主要区别在于,ajax提交表单是异步提交的,而普通的是同步提交的表单.通过在后台与服务器进行少量数据交换,ajax 可以使网页实现异步更新.这意味 ...

随机推荐

  1. qq在线

    <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1749904992&site=q ...

  2. Thinkphp 调试方法

    1.入口文件index.php配置APP_DEBUG,能直接发现页面上的错误 define('APP_DEBUG',True); 2.配置页面调试SHOW_PAGE_TRACE,可以在config里面 ...

  3. CentOS7使用iptables防火墙开放端口

    背景:在CentOS上面安装了mysql.svn.tomcat等软件,发现访问不了,用telnet命令查看端口,发现都不通: telnet IP 端口 CentOS7 默认使用firewalld防火墙 ...

  4. Android 对保存在 sharedpreference的重要数据进行编解码

    有时候为了登录方便会将用户名和密码保存在 sharedpreference里面,可是如果不加以处理密码将以明文保存. 在Android中java层提供了工具类:android.util.Base64; ...

  5. 多线程 多进程 协程 Queue(爬虫代码)

    快速理解多进程与多线程以及协程的使用场合和特点 首先我们来了解下python中的进程,线程以及协程! 从计算机硬件角度: 计算机的核心是CPU,承担了所有的计算任务.一个CPU,在一个时间切片里只能运 ...

  6. python3.7 安装gensim使用word2Vec库

    应用的文章(个人试验过,完全正确):https://radimrehurek.com/gensim/index.html#install

  7. 指定程序集的位置 | Microsoft Docs

    原文:指定程序集的位置 | Microsoft Docs 指定程序集的位置Specifying an Assembly's Location 2017/03/30 作者 使用<b a s e & ...

  8. golang数据类型三

  9. 值得研究的J2EE开源项目推荐

    导读:笔者在学习J2EE的过程中发现了一些很有用,而且很值得学习的开源项目,在此推荐给大家. 关键词:J2EE 开源项目 J2SE JBoss SOA EJB   这篇文章写在我研究J2SE.J2EE ...

  10. day39-Spring 12-Spring的JDBC模板:快速入门

    Spring AOP的关键是它的底层的原理和思想,配置和使用并不是十分困难.AOP本身就是一个思想,是面向对象的延伸,不是用来替换面向对象的,而是用来解决面向对象中的一些问题的.在最初的时候提出过一个 ...