有关文件上传 非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 相关文章推荐
Javascript写了一个清除“logo1_.exe”的杀毒工具(可扫描目录)
Feb 09 Javascript
使用JQuery快速实现Tab的AJAX动态载入(实例讲解)
Dec 11 Javascript
Node.js模块加载详解
Aug 16 Javascript
Node.js操作mysql数据库增删改查
Mar 30 Javascript
原生js编写2048小游戏
Mar 17 Javascript
微信小程序实现多个按钮toggle功能的实例
Jun 13 Javascript
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
Sep 20 jQuery
bootstrap table方法之expandRow-collapseRow展开或关闭当前行数据
Aug 09 Javascript
Bootstrap Paginator+PageHelper实现分页效果
Dec 29 Javascript
vue-cli中vue本地实现跨域调试接口
Jan 16 Javascript
基于elementUI实现图片预览组件的示例代码
Mar 31 Javascript
Vue多选列表组件深入详解
Mar 02 Vue.js
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
Yii框架引用插件和ckeditor中body与P标签去除的方法
2017/01/19 PHP
JavaScript实现动态增加文件域表单
2009/02/12 Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
2013/04/16 Javascript
jquery实现盒子下拉效果示例代码
2013/09/12 Javascript
jquery模拟SELECT下拉框取值效果
2013/10/23 Javascript
jquery动态加载js/css文件方法(自写小函数)
2014/10/11 Javascript
详解JavaScript异步编程中jQuery的promise对象的作用
2016/05/03 Javascript
基于Vue.js的表格分页组件
2016/05/22 Javascript
javascript中异常处理案例(推荐)
2016/10/03 Javascript
解决nodejs中使用http请求返回值为html时乱码的问题
2017/02/18 NodeJs
vue-router单页面路由
2017/06/17 Javascript
微信小程序“摇一摇”的实例代码
2017/07/20 Javascript
vue实现a标签点击高亮方法
2018/03/17 Javascript
从零开始搭建webpack+react开发环境的详细步骤
2018/05/18 Javascript
layui中table表头样式修改方法
2018/08/15 Javascript
js 实现在2d平面上画8的方法
2018/10/10 Javascript
javascrpt密码强度校验函数详解
2020/03/18 Javascript
微信小程序以7天为周期连续签到7天功能效果的示例代码
2020/08/20 Javascript
详解Python中expandtabs()方法的使用
2015/05/18 Python
详解Python中的相对导入和绝对导入
2017/01/06 Python
Python使用遗传算法解决最大流问题
2018/01/29 Python
python for 循环获取index索引的方法
2019/02/01 Python
python 利用jinja2模板生成html代码实例
2019/10/10 Python
Nº21官方在线商店:numeroventuno.com
2019/09/26 全球购物
北美最大的参茸药食商城:德成行
2020/12/06 全球购物
青年教师典范事迹材料
2014/01/31 职场文书
房屋买卖协议书
2014/04/10 职场文书
国际经济贸易专业自荐信
2014/06/13 职场文书
2014年技术工作总结范文
2014/11/20 职场文书
2015年学校关工委工作总结
2015/04/03 职场文书
让子弹飞观后感
2015/06/11 职场文书
2016年中秋节晚会领导致辞
2015/11/26 职场文书
python批量更改目录名/文件名的方法
2021/04/18 Python
Python实现简单的猜单词
2021/06/15 Python
ElementUI实现el-form表单重置功能按钮
2021/07/21 Javascript
mybatis源码解读之executor包语句处理功能
2022/02/15 Java/Android