ASP.NET MVC 中的 HttpPostedFileBase 编辑器模板

Question

我正在使用 ASP.NET MVC 5 并拥有这个简单的 ViewModel。

public class ArtistVM
{
    public string FName { get; set; }
    public string LName { get; set; }
    public HttpPostedFileBase ImgUpload { get; set; }
}

我知道我需要 HttpPostedFileBase 的自定义编辑器模板，所以我继续在 ~/Views/Shared/EditorTemplates/ 中添加了 HttpPostedFileBase.cshtml，其中包含以下内容：

@model HttpPostedFileBase

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

就显示类型文件的输入而言，这似乎工作正常！

问题发生在 posting 和绑定时，我的 ImgUpload 属性总是返回 null，这告诉我编辑器模板中有些地方不对。

新艺术家视图的代码如下所示：

@using (Html.BeginForm("New", "Artist", FormMethod.Post, new { encrypt = "multipart/form-data"})) 
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.FName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.FName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.FName, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.LName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.LName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.LName, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.ImgUpload, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.ImgUpload, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.ImgUpload, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Add Artist" class="btn btn-primary" />
            </div>
        </div>
    </div>
}

处理 post 的控制器动作是：

[HttpPost]
public ActionResult New(ArtistNewVM vm)
{
    var validImageTypes = new string[]
    {
        "image/gif",
        "image/jpeg",
        "image/pjpeg",
        "image/png"
    };

    if (vm.ImgUpload == null || vm.ImgUpload.ContentLength == 0)
    {
        // ** gets inside here **
        ModelState.AddModelError("ImageUpload", "This field is required");
    }
    else if (!validImageTypes.Any(vm.ImgUpload.ContentType.Contains))
    {
        ModelState.AddModelError("ImageUpload", "Please choose either a GIF, JPG or PNG image.");
    }

    if (ModelState.IsValid)
    {
        // do the magic
    }

    return View(vm);
}

Answer 1

您的 html 属性格式错误，它是 enctype 代表 "encoding type" 而不是 encrypt see here

The enctype attribute’s purpose is to indicate how form data should be encoded prior to it being sent to the location defined in the action attribute.

变化：

new { encrypt = "multipart/form-data"}

至：

new { enctype = "multipart/form-data"}

ASP.NET MVC 中的 HttpPostedFileBase 编辑器模板

HttpPostedFileBase Editor Template in ASP.NET MVC

c#

asp.net-mvc

mvc-editor-templates

asp.net-mvc-5.2