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. oracle function学习1

    oracle function学习基层: 函数就是一个有返回值的过程.  首先 知道oracle 使用限制:      函数调用限制: 1. SQL语句中只能调用存储函数(服务器端),而不能调用客户端 ...

  2. tomcat9下载与安装

    tomcat9下载与安装 官网下载地址:https://tomcat.apache.org/ 百度云地址:链接:https://pan.baidu.com/s/109PYcSh-eqTctLAXIsb ...

  3. CSS-DOM的小知识(二)

    上篇文章说到,通过element.style.property可以获得元素的样式,但是style属性只能够返回内嵌样式,对于外部样式表的样式和head中的style样式都无法获取,这就限制了此方法的使 ...

  4. python3.7的celery报错TypeError: wrap_socket() got an unexpected keyword argument '_context'

    原启动方法为: 起执行任务的服务 elery worker -A celery_task -l info -P eventlet 起提交任务的服务 celery beat -A celery_task ...

  5. 【Leetcode 堆、快速选择、Top-K问题 BFPRT】有序矩阵中第K小的元素(378)

    题目 给定一个 n x n 矩阵,其中每行和每列元素均按升序排序,找到矩阵中第k小的元素. 请注意,它是排序后的第k小元素,而不是第k个元素. 示例: matrix = [ [ 1, 5, 9], [ ...

  6. px和rem换算

    bootstrap默认 html{font-size: 10px;} rem是一个相对大小的值,它相对于根元素<html>, 假设,我们设置html的字体大小的值为html{font-si ...

  7. 简单线性回归(最小二乘法)python实现

      简单线性回归(最小二乘法)¶   0.引入依赖¶ In [7]: import numpy as np import matplotlib.pyplot as plt   1.导入数据¶ In [ ...

  8. windows10环境运用SSH和SwitchySharp自由翱翔

    以下纯干货: 安装篇: 安装git bash(自行去找下载包) 安装xshell(开始想用它,后来直接在git bash里用命令搞定了,安装它SSH Server就可用了可能) 安装Chrome的插件 ...

  9. java返回结果集封装

    1.返回消息统一定义文件CodeMsg.java public class CodeMsg { private int retCode; private String message; // 按照模块 ...

  10. SpingMVC ModelAndView, Model,Control以及参数传递总结

    1.web.xml 配置: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 <servlet>     <servlet-name>dispatcher& ...