easyUI dialog 缓存问题引起form表单提交文件的错乱
2018-02-03 14:21
351 查看
最近在做项目的时候遇到一个看似简单 但是又很头疼的问题,功能是这样的:使用easyUI的dialog弹出的一个form的提交文件的上传功能,简单吧?就这么简单一个问题花了我一天的时间,当然脑子比较不灵光哈,废话少说进入正题,遇到的问题是这样的:在上传文件的时候初次操作'不选文件直接上传',当然会上传失败了!服务器返回的没毛病! 问题来了,,,,当dialog.close()之后从新上传文件,这次的操作是'选择一个文件'点击上传,当然会上传成功了!这是正常的情况下才会出现的,但是咱们说的不是正常情况,返回的结果跟第一次是一样的,服务器返回的额是上传失败!
又测试了一次,重新刷新大页面,初次操作"选择一个文件",服务器返回上传成功!第二次操作"无论选择文件还是不选择文件"都会上传成功,但是上传的初次选择的那个文件,在继续操作又正常了!只有初次进去的时候的前两次操作有问题(可能测试的还不够全面),但是就抓住这几个现象想的我头都大了,没办法问一下度娘吧,查了好多么有找到正题,
突然看到一个博客还是很贴近的https://www.cnblogs.com/lwucoder/archive/2017/03/16/web_cache_method.html,有兴趣可以进去看看,有三种方法,一是禁止浏览器从本地计算机中访问页面的缓存缓存内容,二是表单每次提交以后reset()一下,三是ajax清理缓存,就挨个试了下,可能遇到的情况不一样,方法一对我无效,方法二有效,呱唧呱唧,出去抽根烟庆祝下.....然而只解决了一个现象的问题,初次上传文件,第二次就会上传正常了,不是缓存初次的文件了,问题解决了,再试试初次不上传文件,第二次选择一个文件试试,心碎了......问题还在,
多方求助,最后在同事的帮助下知道了,easyUI的dialog缓存问题,把dialog,$(this).dialog('destroy')掉,又试了下,好使了,都好用了,终于完事了,就在我打算出去抽一包烟庆祝的时候,又有一个新问题来了,就是dialog只能弹出来两次(至今不知道原因),两次操作以后就歇菜了,也是按钮再点击不管用了,因为你把dialog destroy掉了,除非刷新整个页面重新在建,但是这不符合操作习惯,也很容易降低客户体验,所以又是一顿百度,很快就找到一个除根的方法了,那就是"操作完以后直接吧div
remove掉,再从新创建一个自己的div,问题完美解决,附上解决方法:
body里面的<div id="a"></div>
function upload(){
var dialogParent = $('#a').parent();
var dialogOwn = $('#a').clone();
dialog = $('#a').dialog({
title: '导入',
href: '页面',
maximizable: false,
modal: true,
onClose : function() {
dialogOwn.appendTo(dialogParent);
$(this).dialog('destroy').remove();
},
buttons: {
"取消": function () {
dialog.dialog('close');},
"确定": function () {
dialog.dialog('close')}
},
}
好了到此就算完美解决了,抽烟庆祝下
又测试了一次,重新刷新大页面,初次操作"选择一个文件",服务器返回上传成功!第二次操作"无论选择文件还是不选择文件"都会上传成功,但是上传的初次选择的那个文件,在继续操作又正常了!只有初次进去的时候的前两次操作有问题(可能测试的还不够全面),但是就抓住这几个现象想的我头都大了,没办法问一下度娘吧,查了好多么有找到正题,
突然看到一个博客还是很贴近的https://www.cnblogs.com/lwucoder/archive/2017/03/16/web_cache_method.html,有兴趣可以进去看看,有三种方法,一是禁止浏览器从本地计算机中访问页面的缓存缓存内容,二是表单每次提交以后reset()一下,三是ajax清理缓存,就挨个试了下,可能遇到的情况不一样,方法一对我无效,方法二有效,呱唧呱唧,出去抽根烟庆祝下.....然而只解决了一个现象的问题,初次上传文件,第二次就会上传正常了,不是缓存初次的文件了,问题解决了,再试试初次不上传文件,第二次选择一个文件试试,心碎了......问题还在,
多方求助,最后在同事的帮助下知道了,easyUI的dialog缓存问题,把dialog,$(this).dialog('destroy')掉,又试了下,好使了,都好用了,终于完事了,就在我打算出去抽一包烟庆祝的时候,又有一个新问题来了,就是dialog只能弹出来两次(至今不知道原因),两次操作以后就歇菜了,也是按钮再点击不管用了,因为你把dialog destroy掉了,除非刷新整个页面重新在建,但是这不符合操作习惯,也很容易降低客户体验,所以又是一顿百度,很快就找到一个除根的方法了,那就是"操作完以后直接吧div
remove掉,再从新创建一个自己的div,问题完美解决,附上解决方法:
body里面的<div id="a"></div>
function upload(){
var dialogParent = $('#a').parent();
var dialogOwn = $('#a').clone();
dialog = $('#a').dialog({
title: '导入',
href: '页面',
maximizable: false,
modal: true,
onClose : function() {
dialogOwn.appendTo(dialogParent);
$(this).dialog('destroy').remove();
},
buttons: {
"取消": function () {
dialog.dialog('close');},
"确定": function () {
dialog.dialog('close')}
},
}
好了到此就算完美解决了,抽烟庆祝下
相关文章推荐
- input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件
- 表单包含file上传文件提交,使用ajaxSubmint或者ajaxForm 遇到的问题以及解决方法
- form表单提交,上传文件以及提交前验证的问题。
- 【原创】AJAX上传文件,formdata表单提交问题
- html disabled 和readonly,disabled 引起的form表单提交问题
- strutsmvc ajaxForm提交表单ie出现json文件下载问题解决
- 一个IE7下,用form表单跳转iframe提交,然后下载文件。遇到的很有意思的问题
- Form表单提交失败问题
- form表单提交问题
- form中的button按钮在IE11中自动提交表单问题导致弹出框关闭之后表单被重置
- form表单提交数据到servlet的action=" "路径问题
- 关于form表单中使用ajax提交表单,ajax无法success的问题
- struts2中form只提交数据不跳转引发的刷新后重复提交表单中数据的问题
- js form表单提交问题
- html5里使用ajax提交含有上传文件的form表单
- Form表单多文件改名ajax提交上传及java后台处理
- 用ajax提交form表单及乱码问题
- 解决Form表单重复提交问题
- form表单里面 button标签自动提交表单的问题
- Chrome浏览器中对form表单用onsubmit进行拦截后无法再次提交的问题