效果图:

代码:

  1. <form id="importFileForm" method="post" enctype="multipart/form-data" style="display:">
  2. <table style="margin:5px;height:70px;">
  3. <tr>
  4. <td></td>
  5. <td width="5px;"></td>
  6. <td><input class="easyui-filebox" id="fileImport" data-options="buttonText:'选择',prompt:'请选择文件...'" name="fileImport" style="width:260px;">
  7. </td>
  8. <td><a id="uploadFile" class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)">上传</a></td>
  9. </tr>
  10. <tr>
  11. <td colspan="4">
  12. <label id="uploadInfo" />
  13. </td>
  14. </tr>
  15. </table>
  16. </form>
  17. <script>
  18. //导入文件
  19. $("#uploadFile").click(function () {
  20. var formData = new FormData($("#importFileForm")[0]);
  21. //调用apicontroller后台action方法,将form数据传递给后台处理。contentType必须设置为false,否则chrome和firefox不兼容
  22. $.ajax({
  23. url: "http://localhost:12745/api/easyuiUpload/PostExcelData",
  24. type: 'POST',
  25. data: formData,
  26. async: false,
  27. cache: false,
  28. contentType: false,
  29. processData: false,
  30. success: function (returnInfo) {
  31. //上传成功后将控件内容清空,并显示上传成功信息
  32. document.getElementById('fileImport').value = null;
  33. document.getElementById('uploadInfo').innerHTML = "<span style='color:Red'>" + returnInfo + "</span>";
  34. },
  35. error: function (returnInfo) {
  36. //上传失败时显示上传失败信息
  37. document.getElementById('uploadInfo').innerHTML = "<span style='color:Red'>" + returnInfo + "</span>";
  38. }
  39. });
  40.  
  41. })
  42. </script>
  43.  
  44. 后台:
  45. public class easyuiUploadController : ApiController
  46. {
  47. /// <summary>
  48. /// 将文件上传到指定路径中保存
  49. /// </summary>
  50. /// <returns>上传文件结果信息</returns>
  51. [System.Web.Http.HttpPost]
  52.  
  53. public string PostExcelData()
  54. {
  55. string info = string.Empty;
  56. try
  57. {
  58. //获取客户端上传的文件集合
  59. HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
  60. //判断是否存在文件
  61. if (files.Count > 0)
  62. {
  63. //获取文件集合中的第一个文件(每次只上传一个文件)
  64. HttpPostedFile file = files[0];
  65. //定义文件存放的目标路径
  66. string targetDir = System.Web.HttpContext.Current.Server.MapPath("~/FileUpLoad/Product");
  67. //创建目标路径
  68. if (!Directory.Exists(targetDir))
  69. {
  70. Directory.CreateDirectory(targetDir);
  71. }
  72. //ZFiles.CreateDirectory(targetDir);
  73. //组合成文件的完整路径
  74. string path = System.IO.Path.Combine(targetDir, System.IO.Path.GetFileName(file.FileName));
  75. //保存上传的文件到指定路径中
  76. file.SaveAs(path);
  77. info = "上传成功";
  78. }
  79. else
  80. {
  81. info = "上传失败";
  82. }
  83. }
  84. catch
  85. {
  86. info = "上传失败";
  87. }
  88. return info;
  89. }
  90. }

  

easyui上传文件的更多相关文章

  1. easyui 上传文件代码

    using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.IO;usi ...

  2. MVC项目使用easyui的filebox控件上传文件

    开发环境:WIN10+IE11,浏览器请使用IE10或以上版本 开发技术框架MVC4+JQuery Easyui+knockoutjs 效果为弹出小窗体,如下图 1.前端cshtml文件代码(只包含文 ...

  3. EasyUI 关于IE使用window组件上传文件

    有时候IE会对使用window组件上传文件(第二次)不生效,解决方案是: 将该window每次打开的时候,使用: $('#adUploadWindow').window('refresh', 'pan ...

  4. .net MVC借助Iframe实现无刷新上传文件

    html: <div id="uploadwindow" style="display: none;"> <form action=" ...

  5. MVC ajax 上传文件

    废话不多说,上代码: 用到的js文件: jquery.min.js jquery.easyui.min.js <input id="fileurl" onclick=&quo ...

  6. easy ui 异步上传文件,跨域

    easy ui 跨域上传文件,代码如下: 1.html代码:(这段代码是个win窗体,我在点击上传图片按钮然后弹出一个上传图片的窗体,选择图片再进行上传,这样在form提交时,提交的参数会少一点.) ...

  7. mvc4 强大的导出和不需要上传文件的批量导入EXCEL--SNF快速开发平台3.1

    数据的导入导出,在很多系统里面都比较常见,这个导入导出的操作,在Winform里面比较容易实现,但在Web上我们应该如何实现呢?本文主要介绍利用MVC4+EasyUI的特点,并结合文件上传控件,实现文 ...

  8. c#+js 使用formdata上传文件

    如果不是使用form表单submit的形式,我们可以手动通过formdata传值(针对文件上传等) 比如: <html> <head> <meta name=" ...

  9. JQUERY AJAX无刷新异步上传文件

    AJAX无刷新上传文件并显示 http://blog.csdn.net/gao3705512/article/details/9330637?utm_source=tuicool jQuery For ...

随机推荐

  1. JS 校验,检测,验证,判断函数集合

    http://jc-dreaming.iteye.com/blog/754690 /**  *判断对象是否为空 *Check whether string s is empty.  */  funct ...

  2. RBAC权限设计实例(转)

    实现业务系统中的用户权限管理 B/S系统中的权限比C/S中的更显的重要,C/S系统因为具有特殊的客户端,所以访问用户的权限检测可以通过客户端实现或通过客户端+服务器检测实现,而B/S中,浏览器是每一台 ...

  3. IntelliJ Idea各种技巧设置笔记和错误解决

    版本控制 GitHub GitHub提示找不到路径: 解决方法:去官方下载gitHub,然后在以下路径找到Git.exe并设置 C:\Users\你的用户\AppData\Local\GitHub\P ...

  4. string 类简介和例程

    一.标准库string类型 string类型支持长度可变的字符串,C++标准库将负责管理与存储字符相关的内存,以及提供各种有用的操作 ,在VC中直接F1查看 template < class C ...

  5. 使用maven开发OSGI样例

    一:创建maven项目,在pom.xml里面增加例如以下依赖 <dependency> <groupId>org.osgi</groupId> <artifa ...

  6. 转 springboot 监控点 简介

    Spring Boot Actuator监控端点小结  2016-12-24  翟永超  Spring Boot 被围观 7973 次另一篇简单介绍: HTTP://BLOG.720UI.COM/20 ...

  7. RabbitMQ php 使用

    RabbitMQ是一个开源的基于AMQP(Advanced Message Queuing Protocol)标准,并且可靠性高的企业级消息系统,目前很多网站在用,包括reddit,Poppen.de ...

  8. 自己定义TextView 调用ttf格式字体

    方法一:自己定义TextView 调用ttf格式字体 <strong>将ttf格式文件存放在assets/fonts/下</strong> 注:PC系统字体存放在C:\Wind ...

  9. CentOS 7.0 关闭firewalld防火墙指令 及更换Iptables防火墙

    CentOS 7.0 关闭firewalld防火墙指令 及更换Iptables防火墙 时间:2014-10-13 19:03:48  作者:哎丫丫  来源:哎丫丫数码网  查看:11761  评论:2 ...

  10. 每日英语:Risk-Averse Culture Infects U.S. Workers, Entrepreneurs

    Americans have long taken pride on their willingness to bet it all on a dream. But that risk-taking ...