2011-10-03 203 views
1

我試圖找到一種體面的方式,允許用戶在編輯個人資料頁上上傳個人資料照片。如何在ASP.NET MVC網站上使用jQuery/AJAX上傳圖片?

我試過Uploadify,但在最近的一些Google Chrome瀏覽器版本中,這似乎不起作用。

理想情況下,我只想讓用戶能夠通過簡單的上傳按鈕(最好是ajax)替換佔位符配置文件圖像,並且一旦圖像上傳完成,就會顯示一個「刪除「按鈕刪除上傳的照片並重新設置默認的佔位符圖像。

是否有任何其他替代方法可以在所有主要瀏覽器中很好地發揮作用並輕鬆整合到MVC應用程序中?

回答

0

要使用jQuery僅上傳HTML 5,並非所有的瀏覽器都能夠這樣做。

你可以做這樣的事情。

您需要有一個IFRAME用於使用該文件創建帖子。

像這樣:

<iframe id="targetUpload" name="targetUpload"></iframe> 

在表單你的目標設定在iframe中。

<form target="targetUpload" name="file" runat="server" method="post" id="file" enctype="multipart/form-data" action="@Url.Content("~/Controller/Upload")"> 

和一個提交按鈕

<input type="Submit" value="Upload"> 

這是上傳不刷新頁面文件的方式。

你可以在使用jquery上傳之前對待這些文件。 (文件類型,大小等)

而且在YOUT控制器,你recive文件:

public ActionResult Upload(HttpPostedFileBase file) 
     { 
      if (file != null && file.ContentLength > 0) 
      { 
       //Save the file in the server path 
       string savePath = Server.MapPath("~/Upload/"); 
       string fileName = file.FileName; 
       savePath += fileName; 
       file.SaveAs(savePath); 
      } 
      return RedirectToAction("Index"); 
     }