有关文件上传 非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 作用域使用说明
Aug 13 Javascript
匹配任意字符的正则表达式写法
Apr 29 Javascript
实现只能输入数字的input不用replace方法
Sep 12 Javascript
纯js实现重发验证码按钮倒数功能
Apr 21 Javascript
全面解析Bootstrap表单使用方法(表单控件)
Nov 24 Javascript
分享自己用JS做的扫雷小游戏
Feb 17 Javascript
Vue.2.0.5过渡效果使用技巧
Mar 16 Javascript
javascript中json对象json数组json字符串互转及取值方法
Apr 19 Javascript
bootstrap table服务端实现分页效果
Aug 10 Javascript
对vue事件的延迟执行实例讲解
Aug 28 Javascript
javascript匿名函数中的'return function()'作用
Oct 15 Javascript
利用前端HTML+CSS+JS开发简单的TODOLIST功能(记事本)
Apr 13 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并发多进程处理利器Gearman使用介绍
2016/05/16 PHP
PHP convert_uudecode()函数讲解
2019/02/14 PHP
jQuery find和children方法使用
2011/01/31 Javascript
js算法中的排序、数组去重详细概述
2013/10/14 Javascript
javascript 循环调用示例介绍
2013/11/20 Javascript
javascript等号运算符使用详解
2015/04/16 Javascript
window.onerror()的用法与实例分析
2016/01/27 Javascript
jQuery实现滚动鼠标放大缩小图片的方法(附demo源码下载)
2016/03/05 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【二】
2016/05/10 Javascript
概述jQuery的元素筛选
2016/11/23 Javascript
Bootstrap基本组件学习笔记之导航(10)
2016/12/07 Javascript
巧用canvas
2017/01/21 Javascript
canvas知识总结
2017/01/25 Javascript
微信小程序之数据双向绑定与数据操作
2017/05/12 Javascript
JavaScript之filter_动力节点Java学院整理
2017/06/28 Javascript
基于angular2 的 http服务封装的实例代码
2017/06/29 Javascript
JavaScript实现计数器基础方法
2017/10/10 Javascript
最后说说Vue2 SSR 的 Cookies 问题
2018/05/25 Javascript
nodejs 使用 js 模块的方法实例详解
2018/12/04 NodeJs
基于JS开发微信网页录音功能的实例代码
2019/04/30 Javascript
javascript实现fetch请求返回的统一拦截
2019/12/22 Javascript
Vue2.x和Vue3.x的双向绑定原理详解
2020/11/05 Javascript
Django的session中对于用户验证的支持
2015/07/23 Python
Python max内置函数详细介绍
2016/11/17 Python
Python cookbook(数据结构与算法)将名称映射到序列元素中的方法
2018/03/22 Python
Python中的几种矩阵乘法(小结)
2019/07/10 Python
Django如何实现网站注册用户邮箱验证功能
2019/08/14 Python
Python实现一个论文下载器的过程
2021/01/18 Python
TheFork葡萄牙:欧洲领先的在线餐厅预订平台
2019/05/27 全球购物
2019年c语言经典面试题目
2016/08/17 面试题
教师党员整改措施
2014/10/24 职场文书
单位个人查摆问题及整改措施
2014/10/28 职场文书
优秀党员推荐材料
2014/12/18 职场文书
4S店销售内勤岗位职责
2015/04/13 职场文书
七年级上册生物的课件
2019/08/07 职场文书
创业计划书之DIY自助厨房
2019/09/06 职场文书