效果图:

代码:

<form id="importFileForm" method="post" enctype="multipart/form-data" style="display:">
<table style="margin:5px;height:70px;">
<tr>
<td></td>
<td width="5px;"></td>
<td><input class="easyui-filebox" id="fileImport" data-options="buttonText:'选择',prompt:'请选择文件...'" name="fileImport" style="width:260px;">
</td>
<td><a id="uploadFile" class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)">上传</a></td>
</tr>
<tr>
<td colspan="4">
<label id="uploadInfo" />
</td>
</tr>
</table>
</form>
<script>
//导入文件
$("#uploadFile").click(function () {
var formData = new FormData($("#importFileForm")[0]);
//调用apicontroller后台action方法,将form数据传递给后台处理。contentType必须设置为false,否则chrome和firefox不兼容
$.ajax({
url: "http://localhost:12745/api/easyuiUpload/PostExcelData",
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (returnInfo) {
//上传成功后将控件内容清空,并显示上传成功信息
document.getElementById('fileImport').value = null;
document.getElementById('uploadInfo').innerHTML = "<span style='color:Red'>" + returnInfo + "</span>";
},
error: function (returnInfo) {
//上传失败时显示上传失败信息
document.getElementById('uploadInfo').innerHTML = "<span style='color:Red'>" + returnInfo + "</span>";
}
}); })
</script> 后台:
public class easyuiUploadController : ApiController
{
/// <summary>
/// 将文件上传到指定路径中保存
/// </summary>
/// <returns>上传文件结果信息</returns>
[System.Web.Http.HttpPost] public string PostExcelData()
{
string info = string.Empty;
try
{
//获取客户端上传的文件集合
HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
//判断是否存在文件
if (files.Count > 0)
{
//获取文件集合中的第一个文件(每次只上传一个文件)
HttpPostedFile file = files[0];
//定义文件存放的目标路径
string targetDir = System.Web.HttpContext.Current.Server.MapPath("~/FileUpLoad/Product");
//创建目标路径
if (!Directory.Exists(targetDir))
{
Directory.CreateDirectory(targetDir);
}
//ZFiles.CreateDirectory(targetDir);
//组合成文件的完整路径
string path = System.IO.Path.Combine(targetDir, System.IO.Path.GetFileName(file.FileName));
//保存上传的文件到指定路径中
file.SaveAs(path);
info = "上传成功";
}
else
{
info = "上传失败";
}
}
catch
{
info = "上传失败";
}
return info;
}
}

  

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. UVA1492 - Adding New Machine(扫描线)

    UVA1492 - Adding New Machine(扫描线) option=com_onlinejudge&Itemid=8&page=show_problem&cate ...

  2. 【Redis】redis+php处理高并发,很好的教程||附上 php的文件锁

    链接至:http://blog.csdn.net/nuli888/article/details/51865401 很好的教程,其中redis+php有点小问题. 附上php文件锁: $fp = fo ...

  3. maven web配置发布路径 cargo自动部署项目到tomcat

    pom.xml中加入以下 配置发布路径 <build> <!-- 发布名 www.locathost:8080/HelloWeb可以访问,如果改成ROOT那么 默认的tomcat也就 ...

  4. 【LeetCode】98. Validate Binary Search Tree (2 solutions)

    Validate Binary Search Tree Given a binary tree, determine if it is a valid binary search tree (BST) ...

  5. HTML5 学习笔记 表单属性

    HTML5新的表单属性 HTML5 的form和input 标签添加了几个新的属性 <form>新属性 autocomplete novalidate input 新属性 autocomp ...

  6. python --标准库 路径与文件 (os.path包, glob包)

    os.path包 os.path包主要是处理路径字符串,提取出有用信息. #coding:utf-8 import os.path path = 'D:\\Python7\\test\\data.tx ...

  7. 快速排序以及第k小元素的线性选择算法

    简要介绍下快速排序的思想:通过一趟排序将要排序的数据分割成独立的两部分,其中一部分的所有数据都比另外一部分的所有数据都要小,然后再按此方法对这两部分数据分别进行快速排序,整个排序过程可以递归进行,以此 ...

  8. ISP图像质量调节介绍

    ISP(Image Signal Processor),即图像处理,主要作用是对前端图像传感器输出的信号做后期处理,主要功能有线性纠正.噪声去除.坏点去除.内插.白平衡.自己主动曝光控制等.依赖于IS ...

  9. Spark in meituan http://tech.meituan.com/spark-in-meituan.html

    Spark在美团的实践 忽略元数据末尾 回到原数据开始处 引言:Spark美团系列终于凑成三部曲了,Spark很强大应用很广泛, 文中Spark交互式开发平台和作业ETL模板的设计都很有启发借鉴意义. ...

  10. memcached+Mysql(主从)

    昨天和守住看了下http://hi.baidu.com/156544632/blog/item/3b26527b68623ff00bd18746.html这篇文章,思路很好,但感觉就是太乱了,而且还出 ...