jQuery MiniUI

 找回密码
 立即注册
查看: 8840|回复: 11
打印 上一主题 下一主题

mini-htmlfile ajax文件上传问题 [复制链接]

跳转到指定楼层
楼主
发表于 2018-8-28 16:45:59 |只看该作者 |倒序浏览
  1. <%@page contentType="text/html;charset=UTF-8" isELIgnored="false"%>
  2. <html>
  3. <title>your jsp title</title>
  4. <%@include file="/include/head.jsp"%>
  5. <!-- css start -->
  6. <style type="text/css">
  7. </style>
  8. <!-- css end -->
  9. <script src="/lemis/js/ajaxfileupload.js" type="text/javascript"></script>
  10. <body class="pageBg">
  11.         <!-- 页面内容 start -->

  12.         <div style="width: 100%;">
  13.                 <div class="mini-toolbar" style="border-bottom: 0; padding: 2px;">
  14.                         <form id="form" method="post">
  15.                         </form>
  16.                 </div>
  17.         </div>
  18.         <div class="mini-fit">
  19.                 <div id="datagrid" class="mini-datagrid" pageSize="20" style="width: 100%; height: 1%;" allowResize="true" url="" idField="id" multiSelect="true"
  20.                         sortField="" sortOrder="desc">
  21.                         </div>
  22.                 </div>
  23.                 <div align="left">
  24.                         <input id="file1" class="mini-htmlfile" name="Fdata" onValueChanged="startUpload()" />
  25.                         <a class="mini-button tz-button2" onclick="openFlieSelect()" style="width: 90px">上传</a>
  26.                 </div>
  27.         </div>
  28.         <!-- 页面内容 end -->
  29.         <!-- js start -->
  30.         <script type="text/javascript">
  31.                 mini.parse();
  32.                 var grid = mini.get("datagrid");
  33.                 var form = new mini.Form("form");
  34.                 gridLoad();
  35.                 tz.setExportButtons("datagrid");
  36.                
  37.                 mini.get("file1").setVisible(false);


  38.                 function gridLoad(data) {
  39.                         var data = form.getData(true);
  40.                         tz.gridLoad(grid, data);
  41.                 }

  42.                
  43.                 //打开文件选择
  44.                 function openFlieSelect() {
  45.                         $(".mini-htmlfile .mini-htmlfile-file").click();
  46.                 }

  47.                 //文件上传
  48.                 function startUpload() {
  49.                         var filePath = mini.get("file1").getValue();
  50.                         var inputFile = $("#file1 > input:file")[0];
  51.                         $.ajaxFileUpload({
  52.                                 url : '',
  53.                                 fileElementId : inputFile,
  54.                                 dataType : 'text',
  55.                                 cache : false,
  56.                                 success : function(data) {
  57.                                         alert(data);
  58.                                 },
  59.                                 error : function(data, status, e) //服务器响应失败处理函数
  60.                                 {
  61.                                         alert(e);
  62.                                 },
  63.                                 complete : function() {
  64.                                         var jq = $("#file1 > input:file");
  65.                                         jq.before(inputFile);
  66.                                         jq.remove();
  67.                                 }

  68.                         });
  69.                 }

  70.         </script>
  71.         <!-- js end -->
  72. </body>
  73. </html>
复制代码
这是整个上传功能的页面,你们url写一下就能用   之前你们说的本地测试显示成功,是因为他执行了
回调函数

所以会显示上传成功
但是在ie中,他没有去访问后台,后台断点没有进去,但是这个照样会执行,data是undefined。你们可以写一下url测试一下
在谷歌中这样是可以正常使用的。data有值.


如果有没有描述清楚的可以指出来,问题是存在的,去除了一些无关紧要的代码,问题还是存在这个页面中

附件: 你需要登录才可以下载或查看附件。没有帐号?立即注册

Rank: 8Rank: 8

沙发
发表于 2018-8-28 16:59:32 |只看该作者
如图,这是我们示例在ie下上传的效果,可以正常返回数据。
附件: 你需要登录才可以下载或查看附件。没有帐号?立即注册

板凳
发表于 2018-8-29 08:32:53 |只看该作者
dforce 发表于 2018-8-28 16:59
如图,这是我们示例在ie下上传的效果,可以正常返回数据。

不好意思 问题没有描述清楚。我知道这样是可以的,这样的方式我也能实现了。
但是我的问题是,如果我把mini.get("file1").setVisible(false);隐藏以后,利用$(".mini-htmlfile .mini-htmlfile-file").click();去打开文件选择框。利用file的onValueChanged="startUpload()"调用文件上传的方法,在ie中失效了,在别的浏览器正常。排查问题,发现ie中没有上传文件到后台,不知道问题出现在哪里。整个页面代码就是之前提交的。把url输入一下就能发现问题了
之前有提问过,附上链接:http://miniui.com/bbs/forum.phpm ... &extra=page%3D1

Rank: 8Rank: 8

地板
发表于 2018-8-29 09:26:36 |只看该作者
沈大爷 发表于 2018-8-29 08:32
不好意思 问题没有描述清楚。我知道这样是可以的,这样的方式我也能实现了。
但是我的问题是,如果我把mi ...

隐藏的我们也测试过,我们本地是没有问题的,请下载我们试用包,基于我们ajax上传的示例修改来重现你的问题。并且把这个修改过的示例打包上传上来。

Rank: 8Rank: 8

5#
发表于 2018-8-29 09:56:56 |只看该作者
沈大爷 发表于 2018-8-29 08:32
不好意思 问题没有描述清楚。我知道这样是可以的,这样的方式我也能实现了。
但是我的问题是,如果我把mi ...

如图这是按你前面的帖子描述做的例子,ie11下做的上传,我们上传存储文件夹upload内正常收到上传文件

附件: 你需要登录才可以下载或查看附件。没有帐号?立即注册

6#
发表于 2018-8-30 15:00:03 |只看该作者
felt 发表于 2018-8-29 09:56
如图这是按你前面的帖子描述做的例子,ie11下做的上传,我们上传存储文件夹upload内正常收到上传文件

...

非常感谢你们的重视,不好意思我之前的例子没有描述清楚,现在我简单的说明一下
我的例子中,一共只有一个按钮,就是上传按钮。
是通过点击上传按钮打开文件选择框。
选择文件以后是利用隐藏的mini-htmlfile中的onValueChange事件去调用上传方法。

7#
发表于 2018-8-30 15:06:46 |只看该作者
本帖最后由 沈大爷 于 2018-8-30 16:04 编辑
felt 发表于 2018-8-29 09:56
如图这是按你前面的帖子描述做的例子,ie11下做的上传,我们上传存储文件夹upload内正常收到上传文件

...

抱歉,能在你的例子中:
去除“点开开始上传文件按钮”   ,
打开文件选择框由“上传”按钮调用,//上传按钮中onclick="openFileSelect()"
mini-htmlfile中添加onValueChanged="startUpload()"

拜托请这样试一下

非常感谢

8#
发表于 2018-8-31 14:00:01 |只看该作者
felt 发表于 2018-8-29 09:56
如图这是按你前面的帖子描述做的例子,ie11下做的上传,我们上传存储文件夹upload内正常收到上传文件

...

问题发现了吗??

Rank: 8Rank: 8

9#
发表于 2018-8-31 14:30:24 |只看该作者
沈大爷 发表于 2018-8-31 14:00
问题发现了吗??

从来没发现有什么问题,不管是怎么上传,都是成功上传的。

10#
发表于 2018-8-31 14:49:48 |只看该作者
felt 发表于 2018-8-31 14:30
从来没发现有什么问题,不管是怎么上传,都是成功上传的。

你的例子并没有按照我之前所说的,区别很大
全程只有一个上传按钮
ie浏览器安全设置不支持通过js非手动点击上传文件(这个问题可能的原因)

去除“点开开始上传文件按钮”   ,
打开文件选择框由“上传”按钮调用,//上传按钮中onclick="openFileSelect()"
mini-htmlfile中添加onValueChanged="startUpload()"

我已经描述的很清楚了,你根本没有和我一样去尝试,反而不断的说没有问题

Archiver|普加软件

GMT+8, 2024-9-8 10:07 , Processed in 1.070628 second(s), 10 queries .

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部