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

 更新时间:2016年10月12日 10:18:03   作者:Teitey  
本文给大家介绍关于文件上传非ajax提交得到后台数据的问题我们该怎么处理呢?下文给大家介绍的非常详细,感兴趣的朋友一起看看吧

下文给大家介绍文件上传非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提交 得到后台数据问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • 网站发布后Bootstrap框架引用woff字体无法正常显示的解决方法

    网站发布后Bootstrap框架引用woff字体无法正常显示的解决方法

    这篇文章主要介绍了网站发布到IIS后Bootstrap框架引用的woff字体无法正常显示的解决方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-11-11
  • Element-plus安装及基础组件使用详解

    Element-plus安装及基础组件使用详解

    ElementPlus是一个基于Vue3的UI组件库,旨在提供丰富的HTML元素封装,以简化前端开发,主要特点包括预定义样式、事件处理、易用性等,为开发者提供了一致且美观的用户界面,同时支持按需导入,提高项目效率,感兴趣的朋友一起看看吧
    2024-09-09
  • JavaScript实现弹出模态窗体并接受传值的方法

    JavaScript实现弹出模态窗体并接受传值的方法

    这篇文章主要介绍了JavaScript实现弹出模态窗体并接受传值的方法,涉及JavaScript模态窗体的实现及基于URL的传值操作技巧,需要的朋友可以参考下
    2016-02-02
  • JavaScript中数组Array.sort()排序方法详解

    JavaScript中数组Array.sort()排序方法详解

    本篇文章主要介绍了JavaScript中数组Array.sort()的排序方法。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-03-03
  • CommonJS与ES6 Module的使用区别分析

    CommonJS与ES6 Module的使用区别分析

    这篇文章主要为大家介绍了CommonJS与ES6 Module的使用区别分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-04-04
  • 解决html input验证只能输入数字,不能输入其他的问题

    解决html input验证只能输入数字,不能输入其他的问题

    下面小编就为大家带来一篇解决html input验证只能输入数字,不能输入其他的问题。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • JavaScript实现类似淘宝的购物车效果

    JavaScript实现类似淘宝的购物车效果

    这篇文章主要介绍了JavaScript实现购物车特效的相关资料,文中通过示例代码详细介绍了,利用Javascript如何实现类似淘宝购物车中商品的单选、全选、删除、修改等功能,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-03-03
  • js的window.showModalDialog及window.open用法实例分析

    js的window.showModalDialog及window.open用法实例分析

    这篇文章主要介绍了js的window.showModalDialog及window.open用法,实例分析了window.showModalDialog与window.open方法的定义、功能与使用技巧,需要的朋友可以参考下
    2015-01-01
  • JS逆向之 webpack 打包站点实战原理分享

    JS逆向之 webpack 打包站点实战原理分享

    本文主要介绍了JS逆向之webpack打包站点实战原理分享,webpack是前端程序员用来进行打包JS的技术,打包之后的代码特征非常明显,更多相关知识需要的小伙伴可以参考下面文章详细内容
    2022-06-06
  • Javascript new关键字的玄机 以及其它

    Javascript new关键字的玄机 以及其它

    本人是Javascript菜鸟,下面是前几天学习Javascript的旅程心得,希望对和我一样的入门者有点用,也希望高手批评指正。
    2010-08-08

最新评论