ASP.NET MVC上傳照片 - httpPostedFileBase爲null

編輯：ASP.NET MVC上傳照片 - httpPostedFileBase爲null

照片在控制器POST方法空值，儘管我上傳它..

我的模型類：

class ProductVM{ 
    public string Name { get; set;} 
    public string Color {get; set;} 
    public HttpPostedFileBase Photo1 { get; set; } 
    }

下面是我如何用剃刀實現視圖：

@model Project.Models.ProductVM 

     @using (Html.BeginForm("AddItem","Item", FormMethod.Post, new { enctype = "multipart/form-data" })) 
{ 


      @Html.AntiForgeryToken() 
      @Html.ValidationSummary(true, "", new {@class = "text-danger"}) 

      @Html.EditorFor(model => model.Name, new {htmlAttributes = new {@class"form-control"}}) 
      @Html.ValidationMessageFor(model => model.Name) 

     // other fields editor's and dropdown's ... 


      <div class="col-xs-offset-2 col-xs-8 add-item-rectangle"><input type="file" name="@Model.Photo1" id="file"/></div> 
      <div class="col-xs-10 add-item-rectangle"></div> 

     <input type="submit" class="btn btn-block add-item-button-text" value="Send"/>

後控制器方法的：

[HttpPost] 
     [ValidateAntiForgeryToken] 
     public ActionResult AddItem(ProductVM product) 
     {    
      //**heere when debuging Photo1 is null despite fact that i uploaded photo** 

      if (!ModelState.IsValid) 
      { 
       //... my stuffs 
      } 

      //.. 
      return RedirectToAction("Index", "Home"); 
     }

來源

2016-12-27 mike_pl

請參閱：[this]（http://stackoverflow.com/questions/16255882/uploading-displaying-images-in-mvc-4） –

對不起，因爲我有點卡在那裏。我現在讀了大約5個例子。是否可以在用戶單擊我的矩形內並上傳照片後以DOM的形式顯示圖像，並且當單擊SUBMIT按鈕時從整個表單發送數據，然後在Post方法中將整個數據從表單和圖像一起保存到數據庫（從實體類）？我正在尋找這樣的例子一起工作好... –

首先，您不能直接發佈到字節數組。因此，您需要一個視圖模型來表示正在創建/修改的產品。在您的視圖模型，你的文件上傳特性應輸入爲HttpPostedFileBase：

public HttpPostedFileBase Image1Upload { get; set; } 
public HttpPostedFileBase Image2Upload { get; set; }

你的動作後會接受您的視圖模型作爲PARAM：

[HttpPost] 
public ActionResult CreateProduct(ProductViewModel model)

這裏面的動作，你會在地圖將視圖模型上的發佈值轉換爲實體類上的相應屬性。對於你的上傳：

if (model.Image1Upload != null && model.Image1Upload.ContentLength > 0) 
{ 
    using (var ms = new MemoryStream()) 
    { 
     model.Image1Upload.InputStream.CopyTo(ms); 
     product.Image1 = ms.ToArray(); 
    } 
}

沖洗並重復其他上傳。您可能還需要添加一些驗證以確保上傳的文件實際上是圖像，但這只是對讀者的練習。

最後，你會保存你的實體正常。

UPDATE

在你更新的代碼，您具備以下條件：

<div class="col-xs-offset-2 col-xs-8 add-item-rectangle"> 
    <input type="file" name="@Model.Photo1" id="file"/> 
</div>

首先，@Model.Photo1會的Model.Photo1僅僅輸出值，它甚至無法用一個文件。相反，Razor只需撥打ToString即可獲得屬性，如name="System.Web.HttpPostedFileBase"。這顯然不正確。什麼你需要的卻是這樣的：

<input type="file" name="@Html.NameFor(m => m.Photo1)" id="file" />

，或者甚至更好，使用一個輔助生成整個輸入：

@Html.TextBoxFor(m => m.Photo1, new { type = "file" })

來源

2016-12-27 15:51:52

這件事情，對我來說很明顯..我在寫評論1帖子上面寫的主要問題是 –

我沒有看到你錯過了什麼。 –

HttpPostedFileBase類型不允許我使用代碼優先方法並創建類型產品的實體集 –

服務器端上傳正常工作與下面的代碼：

<div class="col-xs-offset-2 col-xs-8 add-item-rectangle"> 
     @Html.TextBoxFor(m => m.ItemFormDto.Photo1, new { type = "file" }) 
    </div>

但是如果我想要在我的矩形內顯示上傳的圖像呢？（用JavaScript - 有可能嗎？）。下面的圖片是如何它現在看起來：

有一個按鈕，但我想： 1）整個矩形是acrea時，如果用戶點擊了 - 他可以添加照片（如果沒有這個按鈕「選擇文件」 2）剛上傳後我想在矩形內顯示這張照片的縮圖。

來源

2016-12-28 15:50:55

ASP.NET MVC上傳照片 - httpPostedFileBase爲null

回答

相關問題