Welcome 微信登录

首页 / 网页编程 / ASP.NET / ASP.NET MVC中使用uploadify上传文件

ASP.NET MVC中使用uploadify上传文件2013-10-20 cnblogs 文酱课程设计需要实现上传文件模块,本来ASP.NET是有内置的控件,但是ASP.NET MVC没有,所以就有两种方 法:自定义和采用第三方插件。由于时间的关系,故采用第三方插件:uploadify。

uploadify的使用必 须下载相应的文件,下载地址:http://www.uploadify.com/download/。

先是视 图:

<asp:Content ID="Content3" ContentPlaceHolderID="head" runat="server"><script src="/Scripts/swfobject.js" type="text/javascript"></script><script src="/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script><script src="/Scripts/jquery.uploadify.v2.1.0.min.js" type="text/javascript"></script><link href="/Content/uploadify.css" rel="stylesheet" type="text/css" /><style type="text/css">.SuccessText{color: Red;font-weight: bold;}.FaileText{color: Green;font-weight: bold;}</style><script type="text/javascript">$(function () {$("#fileInput1").uploadify({"uploader": "/Content/uploadify.swf","script": "/Home/LoadFile","folder": "/UploadFiles","cancelImg": "/Content/cancel.png","sizeLimit": 1024 * 1024 * 4, //4M"multi": true,"onComplete": Complete});});function Complete(event, queueID, fileObj, response, data) {if (response != "") {showInfo("成功上传" + response, true);}else {showInfo("文件上传出错!", false);}}//显示提示信息,SuccessText为绿色,即上传成功;FalseText为红色,即上传失败function showInfo(msg, type) {var msgClass = type == true ? "SuccessText" : "FaileText";$("#result").removeClass();$("#result").addClass(msgClass);$("#result").html(msg);}//如果点击‘导入文件’时选择文件为空,则提示function checkLoad() {if ($.trim($("#fileInput1Queue").html()) == "") {alert("请先选择要上传的文件!");return false;}return true;}</script></asp:Content><asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"><p><p><input id="fileInput1" name="fileInput1" type="file" /></p><p style="margin-top: 5px; font-size: 14px; font-weight: bold;"><a href="javascript:if(checkLoad()){$("#fileInput1").uploadifySettings("scriptData",{"name":$("#test").val()});$("#fileInput1").uploadifyUpload();}">上传</a></p><p style="margin-top: 5px; font-size: 14px; font-weight: bold;"><span id="result"></span></p></p></asp:Content>