有关文件上传 非ajax提交 得到后台数据问题


Posted in Javascript onOctober 12, 2016

下文给大家介绍文件上传非ajax提交得到后台数据的操作方法,具体详情如下所示;

<form name="configForm" id="configForm" method="post" action="" >
..........
</form>

根据id获得表单数据然后发送ajax请求,获得后台返回数据,处理数据,完美。

但是如果需要上传文件,

<tr>
<td class="fontSize">请选择文件:</td>

<td><input type="" class="easyui-filebox" id="fileImport" name="file" value="" style="width:300px;"></td>
</tr>

这个文件数据后台得不到,表单数据这个file也是null,这时需要

<form name="configForm" id="configForm" method="post" action="" enctype="multipart/form-data" >

添加的这个enctype="mutipart/form-data" 后台可以

@RequestMapping("/saveAppVersion")
@ResponseBody
public ModelMap saveAppVersion(String action, TbdAppVersion tbdAppVersion,


@RequestParam(value = "file") MultipartFile file) {....
}

接收。

但是必须要表单提交请求数据,ajax仍然不行(具体原因可以百度。。)

<form name="configForm" id="configForm" method="post" action="/admin/systemConfig/saveAppVersion.do" enctype="multipart/form-data">
......
</form>

easyui里面的js submit提交

handler : function() {
$("#configForm").submit();
}

那么问题来了,提交过后如何获得后台返回数据呢?

<form name="configForm" id="configForm" method="post" action="/admin/systemConfig/saveAppVersion.do"


enctype="multipart/form-data" target="myIframe"> 。。。。。 </form>
<iframe name="myIframe" id="if_json" style="display:none">
</iframe>

在表单里添加一个target,也就是说提交成功返回的数据写在了name为myIframe的这个iframe中,只刷新这个iframe,接下来就是获得这个数据了,

虽然百度不是什么好鸟,但是有些东西还是可以找到的,比如以下获取iframe数据的方法!

handler : function() {
$("#configForm").submit();

$("#if_json").load(function(){//获取iframe中的内容

var body = $(window.frames['myIframe'].document.body);

var data = eval('(' + body[0].textContent + ')'); 


if(data.resultCode && data.resultCode != 0){


  .........


}else{




 .........




}

});
}

以上所述是小编给大家介绍的有关文件上传 非ajax提交 得到后台数据问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
从sohu弄下来的flash中展示图片的代码
Apr 27 Javascript
Angularjs 设置全局变量的方法总结
Oct 20 Javascript
Vue中的ref作用详解(实现DOM的联动操作)
Aug 21 Javascript
解决option标签selected=&quot;selected&quot;属性失效的问题
Nov 06 Javascript
vue实现nav导航栏的方法
Dec 13 Javascript
在Vue项目中使用d3.js的实例代码
May 01 Javascript
Vue 组件修改根实例的数据的方法
Apr 02 Javascript
Vue Echarts实现可视化世界地图代码实例
May 07 Javascript
微信小程序本地存储实现每日签到、连续签到功能
Oct 09 Javascript
vue之延时刷新实例
Nov 14 Javascript
JS实现公告上线滚动效果
Jan 10 Javascript
代码解析React中setState同步和异步问题
Jun 03 Javascript
jquery动态创建div与input的实例代码
Oct 12 #Javascript
javascript加载xml 并解析各节点的值(实现方法)
Oct 12 #Javascript
jquery动态添加文本并获取值的方法
Oct 12 #Javascript
jquery 动态增加,减少input表单的简单方法(必看)
Oct 12 #Javascript
微信小程序 生命周期详解
Oct 12 #Javascript
让html元素随浏览器的大小自适应垂直居中的实现方法
Oct 12 #Javascript
Angularjs手动解析表达式($parse)
Oct 12 #Javascript
You might like
php中smarty变量修饰用法实例分析
2015/06/11 PHP
PHP实现中文圆形印章特效
2015/06/19 PHP
PHP共享内存使用与信号控制实例分析
2018/05/09 PHP
jQuery 数据缓存data(name, value)详解及实现
2010/01/04 Javascript
JavaScript Event学习第八章 事件的顺序
2010/02/07 Javascript
javaScript call 函数的用法说明
2010/04/09 Javascript
3Z版基于jquery的图片复选框(asp.net+jquery)
2010/04/12 Javascript
js删除所有的cookie的代码
2010/11/25 Javascript
JavaScript判断DOM何时加载完毕的技巧
2012/11/11 Javascript
jquery清空textarea等输入框实现代码
2013/04/22 Javascript
非常漂亮的JS+CSS图片幻灯切换特效
2013/11/20 Javascript
js实现按一下删除键删除整个单词附demo
2014/09/05 Javascript
jquery使用each方法遍历json格式数据实例
2015/05/18 Javascript
JavaScript中Date.toSource()方法的使用教程
2015/06/12 Javascript
郁闷!ionic中获取ng-model绑定的值为undefined如何解决
2016/08/27 Javascript
JavaScript如何一次性展示几万条数据
2017/03/30 Javascript
Vue项目webpack打包部署到服务器的实例详解
2017/07/17 Javascript
使用classList来实现两个按钮样式的切换方法
2018/01/24 Javascript
使用vue cli4.x搭建vue项目的过程详解
2020/05/08 Javascript
vue data对象重新赋值无效(未更改)的解决方式
2020/07/24 Javascript
详解Python中打乱列表顺序random.shuffle()的使用方法
2019/11/11 Python
Python3并发写文件与Python对比
2019/11/20 Python
python mysql中in参数化说明
2020/06/05 Python
解决Keras 自定义层时遇到版本的问题
2020/06/16 Python
Pytorch框架实现mnist手写库识别(与tensorflow对比)
2020/07/20 Python
calendar在python3时间中常用函数举例详解
2020/11/18 Python
美国生鲜及杂货电商:FreshDirect
2018/01/29 全球购物
澳大利亚波希米亚风时尚品牌:Tree of Life
2019/09/15 全球购物
优质有机椰子产品:Dr. Goerg
2019/09/24 全球购物
商铺消防安全责任书
2014/07/29 职场文书
2015学校师德师风工作总结
2015/04/22 职场文书
2016大学优秀学生干部事迹材料
2016/03/01 职场文书
青年人初次创业的“五不要”
2019/08/23 职场文书
Python基础之进程详解
2021/05/21 Python
Windows server 2012搭建FTP服务器
2022/04/29 Servers
Java实现注册登录跳转
2022/06/16 Java/Android