探索Asp.net mvc 的文件上传(由浅入深)
来源:互联网 发布:java实现支付功能代码 编辑:程序博客网 时间:2024/04/29 21:23
代码下载:http://files.cnblogs.com/n-pei/mvcfileupload.zip
最近因为TeamVideo需要用到视频和图片上传功能,所以试着Google了很多资料,和大家分享下。
1.最基本的文件上传。
在View界面通过Form把数据POST到控制端(Controller),Controller把文件存储到服务器,再Redirect到其他页面。
View部分的代码:
Controller部分需要判断是否有Post过来文件,有文件就保存,再重定向到index页面。
上面的例子是最简单的,下一步我们考虑给它加上一个jQuery的UI,让上传文件时的样子变成如下:
要达到这个效果,首先需要下载jQuery UI的几个插件。
在模板中添加这些脚本:
把上面实现的简单的文件上传放到一个DIV中,我们需要实现的功能是当鼠标点击某个按钮时,这个DIV会弹出来。
最后是DIV弹出的脚本:
接下来我们考虑把图片上传到服务器后再让它显示在当前页面中。显示的效果如下:
也就是说我们在上传图片到服务器端后,需要得到此图片的创建时间,大小名称等。
FileRepository把文件的信息放到一个List中:
通过Controller部分把这个List传递给View。
View部分的代码请参考附件。
对于图片的存储,我下一步想着把它存储在数据库中。
首先是创建表结构:
使用ADO.NET Data Model来存储数据,所以我们需要创建一个edmx文件。
保存到图片到数据库中的Controller部分:
View部分代码:
过程如下图:
这里需要一个辅助类来帮助输入文本的Post。你可以在下载的代码中看到。
上传图片并保存到数据库中,我们还需要来把图片显示出来,这个相对来说就比较麻烦了。
搜索了很久才找到的方法如下:
保存图片到数据库后的查询结果:
目前我还不知道如何把一个List的图片显示出来。希望谁能够提供一个好的解决方案。
传统的方法来存储文件(图片)上面的介绍已经很多了。如何使用AJAX方法来存储文件到服务器呢?
我搜索了下,比较多的是使用jQuery Form这个插件来实现的。
你需要去下载jQuery Form这个插件,放到你的Script文件夹中。并在Master模板中添加。
当你点击Button时,创建一个Form并使用AJAX方式POST到服务器端保存。保存方式就不说了,下面是使用jQuery Form的JS代码:
除了使用jQuery form这个插件还有其他的AJAX方式实现文件的上传:
我举两个例子:
1. jQuery & Flash AJAX上传文件。
代码地址:http://swfupload.googlecode.com/
主要是通过Flash和js的交互用flash程序来post数据到后台的Controller。
除了flash部分,其它的和上面介绍的代码大同小异。我会在代码包里放上这部分的代码,供大家下载。
效果:
2. 纯jQueryAJAX上传文件(http://valums.com/ajax-upload/)
这个推荐大家看一下。
看这边文章的同仁们,周末愉快,呵呵。
参考资料:
http://weblogs.asp.net/imranbaloch/archive/2010/04/03/image-preview-in-asp-net-mvc.aspx、
http://weblogs.asp.net/jgalloway/archive/2008/01/08/large-file-uploads-in-asp-net.aspx
http://www.highoncoding.com/Articles/689_Uploading_and_Displaying_Files_Using_ASP_NET_MVC_Framework.aspx
http://www.mikesdotnetting.com/Article/125/ASP.NET-MVC-Uploading-and-Downloading-Files
http://valums.com/ajax-upload/
Cheers
- 探索Asp.net mvc 的文件上传(由浅入深)
- 探索Asp.net mvc 的文件上传(由浅入深)
- 探索Asp.net mvc 的文件上传(由浅入深)
- 探索Asp.net mvc 的文件上传(由浅入深)
- Asp.net mvc 的文件上传
- ASP.NET MVC上传文件的方法
- ASP.NET MVC 上传文件
- ASP.NET MVC - 文件上传
- asp.net MVC上传文件
- asp.net mvc文件上传
- ASP.NET MVC上传文件
- asp.net mvc文件上传
- asp.net mvc文件上传
- ASP.NET MVC上传文件
- 【VS2010】asp.net MVC 上传文件 的方法
- ASP.NET MVC Tips #1 - 支持上传文件的ModelBinder
- ASP.NET MVC上传文件的几种方法
- Asp.net MVC 中的一个文件上传
- 关于Oracle审计(audit)
- 链表操作类
- 噢,第二天上班
- js国家省份城市 级联 ,只有点中国的时候才可以选省份,城市
- 哎,第三天上班
- 探索Asp.net mvc 的文件上传(由浅入深)
- SAP中使用ABAP远程连接MS Sql Server服务器
- 写在互联网创业的路上:如何从无到有的打造一个产品
- SAP链接外部数据库的实现方法
- VS2010如何添加源代码管理
- 多层数据库应用基于Delphi DataSnap方法调用的实现(四)BLOB字段的读写
- SAP工作分配
- C++ 单件模式学习笔记
- SAP新建开发类