MVC Ajax上传文件
前台:首先要导入jQuery
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/scripts/jquery-3.2.1.js"></script>
<script type="text/javascript">
function SubFile() {
var fileUpload = $("#fupload").get(0);
var files = fileUpload.files;
var data = new FormData();
for (var i = 0; i < files.length; i++) {
data.append(files[i].name, files[i]);
}
var baseUrl = "/Default/UploadFile" + "?r=" + Math.random();
$.ajax({
url: baseUrl,
type: "POST",
data: data,
contentType: false,
processData: false,
success: function (result) {
alert(result);
},
error: function (err) {
alert("出现错误:" + err.statusText)
}
});
}
function UpSubFile() {
$("#fupload").click();
}
</script>
</head>
<body>
<div>
单文件上传:
<input type="file" id="fupload" style="display:none" onchange="SubFile()" />
<input type="button" value="上传" onclick="UpSubFile()" />
多文件上传:
<input type="file" multiple id="fuploadMult" onchange="SubFile()" />
</div>
</body>
</html>
后台:
[HttpPost]
public string UploadFile()
{
try
{
HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
foreach (string item in files)
{
HttpPostedFile file = files[item];
var fileName = Path.GetFileName(file.FileName);
var filePath = "/Content/UploadFile";
string newFileName = Guid.NewGuid().ToString() + fileName;
file.SaveAs(Server.MapPath(Path.Combine(filePath, newFileName)));
}
return "OK";
}
catch (Exception ex)
{
return ex.Message;
}
}
MVC Ajax上传文件的更多相关文章
- asp.net MVC ajax上传文件
普通上传 view: <body> <form id="form1" method="post" action="@Url.Acti ...
- MVC ajax 上传文件
废话不多说,上代码: 用到的js文件: jquery.min.js jquery.easyui.min.js <input id="fileurl" onclick=&quo ...
- C# MVC ajax上传 文件
用普通的ajax提交表单的时候,不能把文件流传到后端去,所以要用到jquery.form.js jquery.form.js到官网下载或者从这里下载:http://pan.baidu.com/s/1c ...
- spring mvc + ajax上传文件,页面局部刷新
1.点击上传按钮进行如下操作,通过表单名称以及input名称获取相应的值,对于上传的文件,使用.files来获取, 因为包含文件的上传,所以采用FormData的形式来进行数据交互,通过append将 ...
- .net mvc ajax 上传文件
1.前端 <div> <input type="file" id="upfile" /> <button type="b ...
- IE8/9 JQuery.Ajax 上传文件无效
IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...
- Asp.Net Mvc异步上传文件的方式
今天试了下mvc自带的ajax,发现上传文件时后端action接收不到文件, Request.Files和HttpPostedFileBase都接收不到.....后来搜索了下才知道mvc自带的Ajax ...
- spring mvc(注解)上传文件的简单例子
spring mvc(注解)上传文件的简单例子,这有几个需要注意的地方1.form的enctype=”multipart/form-data” 这个是上传文件必须的2.applicationConte ...
- 关于Extjs MVC模式上传文件的简单方式
Extjs新手研究上传文件的事情估计是件很头痛的问题,毕竟,我就在头痛.最近两天一直在忙文件上传问题,终于小有收获. 用的是Extjs+MVC3.0+EF开发,语言为C#.前台window代码显示列内 ...
随机推荐
- window10:jdk 8下载和安装步骤
window10:jdk 8下载和安装步骤 点击链接:https://blog.csdn.net/qq_39720249/article/details/80721719
- 项目Alpha冲刺(团队)-第四天冲刺
格式描述 课程名称:软件工程1916|W(福州大学) 作业要求:项目Alpha冲刺(团队)-代码规范.冲刺任务与计划 团队名称:为了交项目干杯 作业目标:描述第三天冲刺的项目进展.问题困难.心得体会 ...
- WPF常见主界面的布局
一.概述 效果图: 暂时没做完,请等待 二.实现 (一)实现无边框窗口 原文:WPF 窗口去除顶部边框(正宗无边框) ============================ 最近在做一个大屏展示视频 ...
- expect 批量自动部署ssh 免密登陆 之 二
#!/usr/bin/expect -f ########################################## hutu #Push the id.pas.pub public key ...
- Nginx:Linux下安装Nginx与配置
准备目录 [root@sijizhen ~]# mkdir /usr/local/nginx [root@sijizhen ~]# cd /usr/local/nginx/ 下载 1.Nginx,在h ...
- Go语言--基础语法笔记
### 换了工作,好久没有添加新文章了,本来是想更新到github上的,想想还是在博客里放着,感觉以前的文章都没有很仔细,都只是问题处理的记录, 以后想新加一些整理的笔记也好 ### 主要内容 2.1 ...
- 小程序 movable-view 在页面中的可移动图标
项目中需要一个可拖动的小图标, 1.小程序组件movable-view 文档地址:https://developers.weixin.qq.com/miniprogram/dev/component/ ...
- python之可变长参数
参数组:*args,**kwargs 实参有按位置和按关键字两种形式定义,*args和**kwargs 位置参数:按照从左到右的顺序定义的参数 位置形参:必选参数 位置实参:按照位置给形参传值 关键字 ...
- java类型转化
Java中的父类/子类相互转化问题: 子类可以转成父类:此时子类能调用父类中定义的方法和变量,如果子类中重写了父类中的一个方法,那么在调用这个方法的时候,将会调用子类中的这个方法 父类转成子类:1.如 ...
- @PostConstruct 和 @PreConstruct
1.从Java EE5规范开始,Servlet中增加了两个影响Servlet生命周期的注解,@PostConstruct和@PreDestroy,这两个注解被用来修饰一个非静态的void()方法.写法 ...