ASP.NET MVC上传照片-httpPostedFileBase为空 [英] ASP.NET MVC upload photo - httpPostedFileBase is null

问题描述

尽管我上传了照片，但控制器发布方法中的照片却为空值.

Photo has null value in controller post method despite that i uploaded it..

我的模型课是:

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

这是我用Razor实现视图的方式:

Here is how I implemented view with Razor:

    @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"/>

Post Controller方法的:

Post Controller method's :

[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");
        }

推荐答案

首先，您不能直接将其发布到字节数组.结果，您将需要一个视图模型来表示正在创建/修改的产品.在您的视图模型上，您的文件上传属性应键入为 HttpPostedFileBase :

First and foremost, you cannot post directly to a byte array. As a result, you'll need a view model to represent the product being created/modified. On your view model, your file upload properties should be typed as HttpPostedFileBase:

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

您的发布操作将接受您的视图模型作为参数:

Your post action will accept your view model as a param:

[HttpPost]
public ActionResult CreateProduct(ProductViewModel model)

在此操作内，您将在视图模型上发布的值映射到实体类上的相应属性.对于您的上传:

Inside this action, you'll map over the posted values on the view model to the corresponding properties on your entity class. For your uploads:

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

冲洗并重复进行其他上载.您可能还需要添加一些验证，以确保上传的文件实际上是图像，但这留给读者练习.

Rinse and repeat for the other upload. You'll probably also want to add some validation to ensure that the uploaded file(s) are in fact images, but that's left as an exercise for the reader.

最后，您只需将实体保存为正常.

Finally, you'll just save your entity as normal.

更新

在更新的代码中，您具有以下内容:

In your updated code, you have the following:

<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" 的名称属性.这显然是不正确的.相反，您需要的是这样的东西:

First, @Model.Photo1 would merely output the value of Model.Photo1, which isn't even possible with a file. Instead, Razor would just call ToString on the property and you'd get a name attribute like name="System.Web.HttpPostedFileBase". That's obviously not correct. What you'd need instead is something like:

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

或者更好的是，使用助手来生成整个输入:

Or, even better, use a helper to generate the whole input:

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

这篇关于ASP.NET MVC上传照片-httpPostedFileBase为空的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！