效果图:

代码:

<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. Cookie技术

    u  常用的API 创建Cookie对象 Cookie(String name, String value)    ->以指定数据创建Cookie对象 设置Cookie对象 void setMa ...

  2. atitit.编程语言会形成进化树--哪些特性会繁荣??通才还是专才的选型 现代编程语言的特性总结

    atitit.编程语言会形成进化树--哪些特性会繁荣??通才还是专才的选型 现代编程语言的特性总结 1.  有一种观点,编程语言就像物种,会形成进化树,有的分支会死掉. 多年之后,你觉得语言会演化成什 ...

  3. SMBUS的介绍与访问

    博文是为了总结自己在bios学习上面的点点滴滴,并且加深印象,由于本人水平有限,难免存在不足之处,望指正,同时感谢CSDN提供的平台.本文主要介绍的是SMBUS. 1  SMBUS的简介 特点: SM ...

  4. [svc]linux测速软件speedtest-cli

    linux测速软件: https://github.com/sivel/speedtest-cli 以下是我在gentoo上测的

  5. 用React Native编写跨平台APP

    用React Native编写跨平台APP React Native 是一个编写iOS与Android平台实时.原生组件渲染的应用程序的框架.它基于React,Facebook的JavaScript的 ...

  6. Nfs实现linux下文件共享

    前提条件 130是第一台机器,131为第二台机器.都为redhat linux64位系统. 1.      共享要求: 130server上生成的清算文件在131文件夹下能够看得到,131文件夹下生成 ...

  7. HDOJ 5289 Assignment 单调队列

    维护一个递增的和递减的单调队列 Assignment Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/65536 K (Ja ...

  8. sed n/N使用说明

    sed的语法格式: sed [option] {sed-command} {input-file} sed在正常情况下,将处理的行读入模式空间(pattern space),脚本中的“sed-comm ...

  9. Memcached安装以及PHP的调用

    Memcached安装以及PHP的调用 [南京·10月17日]OSC源创会开始报名:Swift.大型移动项目构架分享 » 一:安装libevent 由于memcached安装时,需要使用libeven ...

  10. 06、Windows 10 技术预览

    随着 Windows 10 发布的,未来 Windows 平台都是统一开发模型,可以只写一个 Appx 包,就可以同时部署到 Windows/ Windowsw Phone/ Tablet /xbox ...