dialog\dialog_attach.aspx

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0,user-scalable=no" />
  6. <meta name="apple-mobile-web-app-capable" content="yes" />
  7. <title>上传附件</title>
  8. <link href="../skin/default/style.css" rel="stylesheet" type="text/css" />
  9. <script src="../../scripts/jquery/jquery-1.11.2.min.js" type="text/javascript"></script>
  10. <script type="text/javascript" charset="utf-8" src="../js/jquery.ajaxfileupload.js"></script>
  11.  
  12. <script type="text/javascript">
  13. $(function () {
  14. //fup_pic2 上传控件ID
  15. $('#txtfiles').change(function () {
  16. upload_pro();
  17.  
  18. });
  19. });
  20.  
  21. function upload_pro() {
  22. $("#uploadimg").html("<img src='../images/ajax-loading.gif'> 附件上传中...")
  23. $.ajaxFileUpload(
  24. {
  25.  
  26. url: '../../tools/upload_ajax.ashx?action=AttachFile&random=' + Math.random(),
  27. secureuri: false,
  28. fileElementId: 'txtfiles',
  29. dataType: 'json',
  30. success: function (data, file) {
  31. if (data.status == 1) {
  32. $(".upload-name").val(data.name);
  33. $(".upload-path").val(data.path);
  34. $(".upload-size").val(data.size);
  35. $("#uploadimg").text("上传成功");
  36. }
  37. else {
  38. parent.dialog({
  39. title: '错误',
  40. content: data.msg,
  41. okValue: '确定',
  42. ok: function () { }
  43. }).showModal(api);
  44. $("#uploadimg").text("");
  45. return false;
  46.  
  47. }
  48. },
  49. error: function (data, status, e) {
  50. $("#uploadimg").text("错误");
  51. }
  52. });
  53.  
  54. $('#txtfiles').change(function () {
  55. upload_pro();
  56. });
  57. }
  58.  
  59. </script>
  60. <script type="text/javascript">
  61. var api = parent.dialog.get(window); //获取父窗体对象
  62. //页面加载完成执行
  63. $(function () {
  64. //设置按钮及事件
  65. api.button([{
  66. value: '确定',
  67. callback: function () {
  68. execAttachHtml();
  69. return false;
  70. },
  71. autofocus: true
  72. }, {
  73. value: '取消',
  74. callback: function () { }
  75. }]);
  76.  
  77. });
  78.  
  79. //创建附件节点
  80. function execAttachHtml() {
  81. var currDocument = $(document); //当前文档
  82.  
  83. if ($("#hidFilePath").val() == "" || $("#hidFileSize").val() == "" || $("#txtFileName").val() == "") {
  84. parent.dialog({
  85. title: '提示',
  86. content: '没有找到已上传附件,请上传!',
  87. okValue: '确定',
  88. ok: function () { }
  89. }).showModal(api);
  90. return false;
  91. }
  92. var fileExt = $("#hidFilePath").val().substring($("#hidFilePath").val().lastIndexOf(".") + 1).toUpperCase();
  93. var fileSize = Math.round($("#hidFileSize").val() / 1024);
  94. var fileSizeStr = fileSize + "KB";
  95. if (fileSize >= 1024) {
  96. fileSizeStr = ForDight((fileSize / 1024), 1) + "MB";
  97. }
  98.  
  99. appendAttachHtml($("#txtFileName").val(), $("#hidFilePath").val(), fileExt, fileSize, fileSizeStr); //插件节点
  100.  
  101. }
  102.  
  103. //创建附件节点的HTML
  104. function appendAttachHtml(fileName, filePath, fileExt, fileSize, fileSizeStr) {
  105.  
  106. var liHtml = '<li>'
  107. + '<input name="hid_attach_id" type="hidden" value="0" />'
  108. + '<input name="hid_attach_filename" type="hidden" value="' + fileName + '" />'
  109. + '<input name="hid_attach_filepath" type="hidden" value="' + filePath + '" />'
  110. + '<input name="hid_attach_filesize" type="hidden" value="' + fileSize + '" />'
  111. + '<i class="icon"></i>'
  112. + '<a href="javascript:;" onclick="delAttachNode(this);" class="del" title="删除附件"></a>'
  113. + '<div class="title">' + fileName + '</div>'
  114. + '<div class="info">类型:<span class="ext">' + fileExt + '</span> 大小:<span class="size">' + fileSizeStr + '</span> '
  115.  
  116. + '</li>';
  117. api.close(liHtml).remove();
  118.  
  119. }
  120. //四舍五入函数
  121. function ForDight(Dight, How) {
  122. Dight = Math.round(Dight * Math.pow(10, How)) / Math.pow(10, How);
  123. return Dight;
  124. }
  125. </script>
  126.  
  127. </head>
  128.  
  129. <body>
  130. <form id="form1" runat="server">
  131. <div class="div-content">
  132. <dl>
  133. <dt>选择文件</dt>
  134. <dd><asp:FileUpload ID="txtfiles" runat="server" class="input txt"/>
  135. <input type="hidden" id="hidFilePath" class="upload-path" />
  136. <input type="hidden" id="hidFileSize" class="upload-size" />
  137. </dd>
  138. </dl>
  139. <div class="dl-attach-box">
  140. <dl>
  141. <dt>文件名称</dt>
  142. <dd>
  143.  
  144. <input type="text" id="txtFileName" class="input txt upload-name" />
  145. <div class="upload-box upload-attach"></div>
  146. </dd>
  147. </dl>
  148. <dl>
  149. <dt></dt>
  150. <dd> <span class="tips">上传文件后,可更改附件名称</span></dd>
  151. </dl>
  152. <dl>
  153. <dt></dt>
  154. <dd><span id="uploadimg"></span></dd>
  155. </dl>
  156. <style>
  157. #uploadimg{color:#000;line-height:32px;font-weight:bold}
  158. #uploadimg img{vertical-align:middle}
  159. </style>
  160. </div>
  161.  
  162. </div>
  163.  
  164. </form>
  165. </body>
  166. </html>

tools\upload_ajax.ashx加入方法

  1. case "AttachFile"://附件上传文件
  2. AttachFile(context);
  3. break;
  1. #region 上传附件的方法,有些IE8不支持webuploader,改用ajaxfileupload
  2. private void AttachFile(HttpContext context)
  3. {
  4. bool _iswater = false;//默认不水印
  5. HttpFileCollection files = context.Request.Files;
  6. if (files == null)
  7. {
  8. context.Response.Write(@"{
  9. status : 'error',
  10. msg : '" + "请选择要上传文件" + @"'
  11. }");
  12. context.Response.End();
  13. return;
  14. }
  15. if (files != null && files.Count > )
  16. {
  17. HttpPostedFile file = files[];
  18. try
  19. {
  20. UpLoad upFiles = new UpLoad();
  21. string remsg = upFiles.fileSaveAs(file, false, _iswater);
  22. Dictionary<string, object> dic = JsonHelper.DataRowFromJSON(remsg);
  23. string status = dic["status"].ToString();
  24. string msg = dic["msg"].ToString();
  25. if (status == "")
  26. {
  27. context.Response.Write("{\"status\":0,\"msg\":\"" + msg + "\"}");
  28. return;
  29. }
  30. else
  31. {
  32. string name = dic["name"].ToString();
  33. string path = dic["path"].ToString();
  34. string fileSize = dic["size"].ToString();
  35. context.Response.Write("{\"status\":1,\"msg\":\"" + msg + "\",\"path\":\"" + path + "\",\"name\":\"" + name + "\",\"size\":" + fileSize + " }");
  36.  
  37. }
  38. }
  39. catch (Exception ex)
  40. {
  41. context.Response.Write("{\"status\": 0,\"msg\":\"" + ex.Message + "\"}");
  42. context.Response.End();
  43. }
  44.  
  45. }
  46.  
  47. }
  48. #endregion

DTCMS中部分IE8不支持webupload上传附件的控件,更改为ajaxfileupload的更多相关文章

  1. vue上传大文件控件

    文件上传是 Web 开发肯定会碰到的问题,而文件夹上传则更加难缠.网上关于文件夹上传的资料多集中在前端,缺少对于后端的关注,然后讲某个后端框架文件上传的文章又不会涉及文件夹.今天研究了一下这个问题,在 ...

  2. AutoIt上传非input控件方式的文件脚本

    AutoIt目前最新是v3版本,这是一个使用类似BASIC脚本语言的免费软件,它设计用于Windows GUI(图形用户界面)中进行自动化操作.它利用模拟键盘按键,鼠标移动和窗口/控件的组合来实现自动 ...

  3. Net上传附件大小控控值(转)

    Server Error 404 – File or directory not found. The resource you are looking for might have been rem ...

  4. 文件上传(FileUpload控件)

    asp.net 文件上传,大文件上传.   新建一个asp.net页面,在工具栏里拖入 FileUpload 上传控件.一个按钮 Button  !    !     ! 进入Button事件 //- ...

  5. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  6. springmvc学习笔记--支持文件上传和阿里云OSS API简介

    前言: Web开发中图片上传的功能很常见, 本篇博客来讲述下springmvc如何实现图片上传的功能. 主要讲述依赖包引入, 配置项, 本地存储和云存储方案(阿里云的OSS服务). 铺垫: 文件上传是 ...

  7. mvc文件上传支持批量上传,拖拽以及预览,文件内容校验等

    使用bootstrap-fileinput 使用方式: 1.nuget:Install-Package bootstrap-fileinput 2.语言本地化{下载fileinput_locale_z ...

  8. .net core版 文件上传/ 支持批量上传,拖拽以及预览,bootstrap fileinput上传文件

    asp.net mvc请移步 mvc文件上传支持批量上传,拖拽以及预览,文件内容校验 本篇内容主要解决.net core中文件上传的问题  开发环境:ubuntu+vscode 1.导入所需要的包:n ...

  9. JavaEE开发之SpringMVC中的自定义消息转换器与文件上传

    上篇博客我们详细的聊了<JavaEE开发之SpringMVC中的静态资源映射及服务器推送技术>,本篇博客依然是JavaEE开发中的内容,我们就来聊一下SpringMVC中的自定义消息转发器 ...

随机推荐

  1. session销毁

    session.invalidate(),session.invalidate的销毁是把这个session所带的用户彻底的销毁,这个session跟用户已经紧密联合在一起,所以就一起销毁了,这样就算换 ...

  2. Helpers\Document

    Helpers\Document The document class is a collection of useful methods for working with files. To get ...

  3. windows系统中eclipse C c++开发环境的搭建

    搜索了网上各种版本的eclipse c,c++ ,头都晕了..以前的版本很多都失效了..下面这个是搞了两天才调通的.超级强大,推荐 1.先装MinGW 2.配置环境变量3.然后把安装目录\mingw\ ...

  4. [转] 详解http和https的作用与区别

    PS: https就是http和TCP之间有一层SSL层,这一层的实际作用是防止钓鱼和加密.防止钓鱼通过网站的证书,网站必须有CA证书,证书类似于一个解密的签名.另外是加密,加密需要一个密钥交换算法, ...

  5. jQuery插件面向对象开发

    为什么要有面向对象的思维,因为如果不这样,你可能需要一个方法的时候就去定义一个function,当需要另外一个方法的时候,再去随便定义一个function,同样,需要一个变量的时候,毫无规则地定义一些 ...

  6. jquery手写焦点轮播图-------解决最后一张无缝跳转第一张的问题

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. flex数据交互方式 转

    Flex数据交互方法- httpservice, webservice, RemoteObject, socket. 写在前面: 使用SOAP Web Service同Flex交互有很多好处,但是它很 ...

  8. 【转】web常见安全问题以及测试方法

    web安全是我们测试组一直以来作为和性能测试并驾齐驱的两个重点.开发的过程中还需要着重注意,该转义的地方转义:该屏蔽的地方屏蔽,该过滤的地方过滤等等.年底又到了,势必又有大批的发号抽奖之类的活动开发. ...

  9. Nginx - SSI Module

    SSI, for Server Side Includes, is actually a sort of server-side programming language interpreted by ...

  10. Slickflow.NET 开源工作流引擎基础介绍(三) -- 基于HTML5/Bootstrap的Web流程设计器

    1. Slickflow Designer 技术优势 1) 基于HTML5技术,兼容常见浏览器; 2) 纯Javascript / JsPlumb 脚本实现SVG图形化显示; JsPlumb允许您使用 ...