ASP.NET MVC中,怎么使用jquery/ajaxForm上传文件
ajaxForm插件最好选择:jquery forms plugin.
以下为示例:
Ajax.BeginForm
@using (Ajax.BeginForm("YourAction", "YourController", new AjaxOptions() { HttpMethod = "POST" }, new { enctype = "multipart/form-data"}))
{
@Html.AntiForgeryToken()
<input type="file" id="file" name="files"><br>
<input type="submit" value="Upload File to Server">
}
或者
@using (Html.BeginForm("YourAction", "YourController", new{ area = "YourArea" }, FormMethod.Post,new { enctype = "multipart/form-data"}))
{
@Html.AntiForgeryToken()
<input type="file" id="file" name="files"><br>
<input type="submit" value="Upload File to Server">
}
Action Method
[HttpPost]
[ValidateAntiForgeryToken]
public void YourAction(IEnumerable<HttpPostedFileBase> files)
{
if (files != null)
{
foreach (var file in files)
{
// Verify that the user selected a file
if (file != null && file.ContentLength > )
{
// extract only the fielname
var fileName = Path.GetFileName(file.FileName);
// TODO: need to define destination
var path = Path.Combine(Server.MapPath("~/Upload"), fileName);
file.SaveAs(path);
}
}
}
}
需要注意:
1,)如果是当前view页面不是~{/Area}/Views/Your/Your.cshtml页面,只能返回void,string,不可以ViewResult,JsonResult,ContentResult等。
1.1,)如果需要返回参数,可以把void 改成string。
1.2,)如果要返回对象,要把对象序列化为字符串,返回字符串;客户端提交时指定返回数据格式:$("#file")ajaxFrom({data:{},dataType:'json',...})。
Progress Bar
<div class="progress progress-striped">
<div class="progress-bar progress-bar-success">0%</div>
</div>
<div id="status"></div>
Jquery & Form script
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script> <script>
(function() { var bar = $('.progress-bar');
var percent = $('.progress-bar');
var status = $('#status'); $('form').ajaxForm({
beforeSend: function() {
status.empty();
var percentVal = '0%';
bar.width(percentVal)
percent.html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
var percentVal = percentComplete + '%';
bar.width(percentVal)
percent.html(percentVal);
},
success: function() {
var percentVal = '100%';
bar.width(percentVal)
percent.html(percentVal);
},
complete: function(xhr) {
status.html(xhr.responseText);
}
}); })();
</script>
参考:http://stackoverflow.com/questions/19042116/ajax-beginform-in-mvc-to-upload-files
ASP.NET MVC中,怎么使用jquery/ajaxForm上传文件的更多相关文章
- jquery ajaxform上传文件返回不提示信息的问题
在使用jquery的ajaxform插件进行ajax提交表单并且上传文件的时候,返回类型datatype :json但是后台通过写出一个json对象后,在执行完以后没有进入success函数,而是直接 ...
- 在MVC中利用uploadify插件实现上传文件的功能
趁着近段的空闲时间,开发任务不是很重,就一直想把以前在仓促时间里所写的多文件上传功能改一下,在网上找了很多例子,觉得uploadify还可以,就想用它来试试.实现自己想要的功能.根据官网的开发文档,同 ...
- jquery.uploadify上传文件配置详解(asp.net mvc)
页面源码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...
- IE8/9 JQuery.Ajax 上传文件无效
IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...
- 项目一:第四天 1、快递员的条件分页查询-noSession,条件查询 2、快递员删除(逻辑删除) 3、基于Apache POI实现批量导入区域数据 a)Jquery OCUpload上传文件插件使用 b)Apache POI读取excel文件数据
1. 快递员的条件分页查询-noSession,条件查询 2. 快递员删除(逻辑删除) 3. 基于Apache POI实现批量导入区域数据 a) Jquery OCUpload上传文件插件使用 b) ...
- 使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能。并且在界面上有radio 的选择内容也要上传
使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能.并且在界面上有radio 的选择内容也要上传 uploadify 插件的 下载和文档地址 ...
- Jquery异步上传文件
我想通过jQuery异步上传文件,这是我的HTML: 1 2 3 <span>File</span> <input type="file" id=&q ...
- ueditor1.3.6jsp版在struts2应用中上传图片报"未找到上传文件"解决方案
摘要: ueditor1.3.6jsp版在struts2应用中上传图片报"未找到上传文件"解决方案 在struts2应用中使用ueditor富文本编辑器上传图片或者附件时,即使配置 ...
- IE下AjaxForm上传文件直接提示下载的兼容性Bug
使用AjaxForm上传文件时候,在IE下直接提示下载保存: 我的示例代码: return this.Json( new { prop1 = 5, prop2 = 10 }); 这种问题只出现在IE下 ...
随机推荐
- NOIp 2014 #5 解方程 Label:数论?
题目描述 已知多项式方程: a0+a1x+a2x^2+..+anx^n=0 求这个方程在[1, m ] 内的整数解(n 和m 均为正整数) 输入输出格式 输入格式: 输入文件名为equation .i ...
- 【BZOJ】1124: [POI2008]枪战Maf
题意 \(n(n < 1000000)\)个人,每个人\(i\)指向一个人\(p_i\),如果轮到\(i\)了且他没死,则他会将\(p_i\)打死.求一种顺序,问死的人最少和最多的数目. 分析 ...
- 【BZOJ2049】 [Sdoi2008]Cave 洞穴勘测 LCT/并查集
两种方法: 1.LCT 第一次LCT,只有link-cut和询问,无限T,到COGS上找了数据,发现splay里的父亲特判出错了(MD纸张),A了,好奇的删了反转T了.... #include < ...
- HDU 5876 关于补图的bfs
1.HDU 5876 Sparse Graph 2.总结:好题,把STL都过了一遍 题意:n个点组成的完全图,删去m条边,求点s到其余n-1个点的最短距离. 思路:把点分为两个集合,A为所有没有到达 ...
- nodejs之async异步编程
1.什么是异步编程? 异步编程是指由于异步I/O等因素,无法同步获得执行结果时, 在回调函数中进行下一步操作的代码编写风格,常见的如setTimeout函数.ajax请求等等. 示例: for (v ...
- 看好你的门-客户端传数据-用java修改referer
1.简单说明 Referer.origin用来表明,浏览器向WEB服务器表明自己来自哪里.但是就它本身而言,并非完全安全. 写一个例子,可以任意修改http信息头中的referer.origin 2. ...
- [LintCode] Reverse Linked List 倒置链表
Reverse a linked list. Have you met this question in a real interview? Yes Example For linked list 1 ...
- Odoo attrs X2many 类型的过滤
有童鞋在群里问到 attrs 中的 many2many类型的字段该如何进行domain过滤,其实非常简单: Many2many的字段在js中获取的值的格式为[[6,false,[]]] 所以attrs ...
- sbt commands
速查手册 常用命令 actions – 显示对当前工程可用的命令 update – 下载依赖 compile – 编译代码 test – 运行测试代码 package – 创建一个可发布的jar包 p ...
- 没有Iphone也能装逼:让Android版QQ显示成Iphone6
在智能手机市场上苹果的iPhone一直都有着很高的关注度,不过其高昂的价格却让人望而却步.有些年轻人为了拥有一部iPhone 不惜出租胸部来做广告位,更有甚者还卖身卖肾.其实这又何苦呢.其实只要小小地 ...