程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> ASP.NET >> ASP.NET基礎 >> 用Html5與Asp.net MVC上傳多個文件的實現代碼

用Html5與Asp.net MVC上傳多個文件的實現代碼

編輯:ASP.NET基礎

復制代碼 代碼如下:
<form action="/Home/Upload" enctype="multipart/form-data" id="form2" method="post">
<input type="file" name="fileToUpload" id="fileToUpload2" multiple="multiple" />
<input type="submit" value="submit" />
</form>

那在Asp.net MVC web application中,我們可以這麼實現:
復制代碼 代碼如下:
@using (Html.BeginForm("Upload", "Home", FormMethod.Post, new { enctype = "multipart/form-data", id = "form2" }))
{
<label for="file">Upload Image:</label>
<input type="file" name="fileToUpload" id="fileToUpload2" multiple="multiple" />
<input type="submit" value="Upload Image by submit" />
}

假設這是一個HomeController下View, 即將提交到Upload的Action,看下面服務端的代碼:
復制代碼 代碼如下:
[HttpPost]
public ActionResult Upload(HttpPostedFileBase[] fileToUpload)
{
foreach (HttpPostedFileBase file in fileToUpload)
{
string path = System.IO.Path.Combine(Server.MapPath("~/App_Data"), System.IO.Path.GetFileName(file.FileName));
file.SaveAs(path);
}

ViewBag.Message = "File(s) uploaded successfully";
return RedirectToAction("Index");
}

好的,就這麼簡單。 這裡我們把接收到文件存儲到App_Data文件夾中,然後返回Index的Action. 看下面圖片,我們能夠從文件選擇器選擇多張圖片:
mutliImagesfiles 

關於HTML5這個特性在那些浏覽器支持,您可以去這裡查看。 您還可以查看W3C官方的文檔。我們在FireFox 14.01下測試能過。

希望對您Web開發有幫助。

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved