Asp.net MVC - 仅使用原始值的模型绑定

Question

我正在构建一个 Web 应用程序，它将把表单中的数据存储在数据库中。我最初的方法是创建一个自定义模型/类，并将 POST 数据绑定到它。这是我之前成功使用的一种方法。然而，这一次它根本行不通。不管我怎么做，我都无法获取绑定到对象属性的值（即model.Title），而只能获取原始值（即String title）。无奈之下，我最终决定将数据绑定到原语。

然而，虽然现在大部分数据都已正确绑定，但我遇到了另一个困难 - 数据没有绑定到 HttpPostedFileBase 对象。最初，我认为我的自定义类可能有问题。这似乎不再是这种情况，而是模型绑定器似乎不再能够正确绑定到 任何 对象，只能绑定到原语。

我的观点

@model StoryWall.ViewModels.AddStoryViewModel
@{
    ViewBag.Title = "Add New Story";
}



<form  method="post" enctype="multipart/form-data" name="addStoryForm" action="Add/SubmitStory" novalidate class="form-horizontal">
    @Html.AntiForgeryToken()


    <div class="form-group"><label class="control-label col-sm-2">Story Title</label><div class="col-sm-10"><input type='text' class="form-control" ng-model="Title" name="PostTitle" required /> <span class="text-danger" ng-show="addStoryForm.model.PostTitle.$touched && addStoryForm.model.PostTitle.$invalid">Title is required.</span></div></div>

    <div class="form-group"><label class="control-label col-sm-2">Story</label><div class="col-sm-10"><textarea class="form-control" ng-model="Body" name="PostBody" required> </textarea> <span class="text-danger" ng-show="addStoryForm.PostBody.$touched && addStoryForm.PostBody.$invalid">Field is required.</span></div></div>



    <div class="form-group"><label class="control-label col-sm-2">Store / Location </label><div class="col-sm-10"><select name="StoreID" class="form-control" ng-model="Store" required > <option value="">Select...</option> 
        @foreach (var store in @Model.stores)
        {
            <option value="@store.StoreID">@store.StoreName</option>
        }
        </select>
         <span class="text-danger" ng-show="addStoryForm.StoreID.$touched && addStoryForm.StoreID.$invalid">Please select a store.</span></div></div>

    <div class="form-group"><label class="control-label col-sm-2">Add a picture (optional)</label><div class="col-sm-10"><input type="file" class="form-control" name="StoryImg"></div></div>

    <div class="form-group"><label class="control-label col-sm-2">Your name</label><div class="col-sm-10"><input type='text' class="form-control" ng-model="Author" name="AuthorName" required /> <span class="text-danger" ng-show="addStoryForm.AuthorName.$touched && addStoryForm.AuthorName.$invalid">Please enter your name.</span></div></div>

    <div class="form-group"><label class="control-label col-sm-2">Your email</label><div class="col-sm-10"><input type='email' class="form-control" ng-model="Email" name="AuthorEmail" required /> <span class="text-danger" ng-show="addStoryForm.AuthorEmail.$dirty && addStoryForm.AuthorEmail.$invalid">Please enter your email.</span></div></div>


    <div ng-controller="TagsCtrl" class="form-group">
        <label class="control-label col-sm-2">Tags (separate with a comma) {{tags.text}}</label>
        <tags-input on-tag-added="updateInput()" ng-model="tags"></tags-input>

            <div class="col-sm-10"><input type='text' class="form-control" ng-model="input.currText" id="tags" name="TagText" /> </div>

    </div>

    <button type="submit" class="btn btn-primary" ng-disabled="addStoryForm.$invalid">Submit</button>
</form>

负责生成上述视图并接受POST数据的Controller：

  public class AddController : Controller
{

    StoryModel dbContext = new StoryModel();

    public ActionResult Index()
    {
      AddStoryViewModel vm = new AddStoryViewModel();
        vm.stores = dbContext.Stores.OrderBy(s => s.StoreName).ToList();

        return View("Index", vm);
    }

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult SubmitStory(String TagText, String PostBody, String PostTitle, int StoreID, String AuthorEmail, String AuthorName, HttpPostedFile StoryImg) 
    {

            Story newStory = new Story();

            // Create new tag if necessary
            String[] tags = TagText.Split(',');

            if (tags.Length > 0) {
                for (int i = 0; i < tags.Length; i++)
                {
                    String tagText = tags[i].ToLower();
                    Tag tag = dbContext.Tags.FirstOrDefault(t => t.TagName.ToLower() == tagText);
                    if (tag != null)
                    {
                        newStory.Tags.Add(tag);
                    }
                    else
                    {
                        Tag newTag = new Tag();
                        newTag.TagName = tags[i].ToLower();
                        dbContext.Tags.Add(newTag);
                        dbContext.SaveChanges();
                        newStory.Tags.Add(tag);

                    }
                }
            }

            newStory.StoryBody = PostBody;
            newStory.DatePosted = DateTime.Now;
            newStory.PosterEmail = AuthorEmail;
            newStory.PosterName = AuthorName;
            newStory.Title = PostTitle;
            newStory.StoreID = StoreID;

            // upload image if uploaded

            if (StoryImg != null)
            {
                String fileName = String.Format("{0}.jpg", new Guid());
                StoryImg.SaveAs(Server.MapPath("~/img/") + fileName);
                newStory.StoryImage = fileName;         
            }
            dbContext.Stories.Add(newStory);
            dbContext.SaveChanges();
            return RedirectToAction("Success", new { storyID = newStory.StoryID });

    }

    public ActionResult Success(Int32 storyID)
    {
        SuccessViewModel vm = new SuccessViewModel();
        vm.newStoryID = storyID;

        return View(vm);

    }
}

}

唯一的非原始 StoryImg 不会绑定 - 它始终为空。

非常感谢您的帮助。

Answer 1

尝试在HttpPost 请求中使用HttpPostedFileBase 作为控制器输入参数，并结合EditorFor 作为表单内的文件容器，如下例所示：

控制器

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult SubmitStory(AddStoryViewModel model, HttpPostedFileBase StoryImg) 
{
     // other stuff

     if (StoryImg != null)
     {
         String fileName = String.Format("{0}.jpg", new Guid());
         StoryImg.SaveAs(Server.MapPath("~/img/") + fileName);
         newStory.StoryImage = fileName;         
     }

     // other code to add story data into DB

     return RedirectToAction("Success", new { storyID = newStory.StoryID });
}

查看

@model StoryWall.ViewModels.AddStoryViewModel

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

    <!-- other stuff -->

    <div class="form-group">
       <label class="control-label col-sm-2">Add a picture (optional)</label>
       <div class="col-sm-10">
       @Html.EditorFor(model => model.StoryImage, new { htmlAttributes = new { @class = "form-control", @type="file" }})
       </div>
    </div>

    <!-- other stuff -->
}

如果上传的文件在StoryImg 中仍然不可用，请尝试使用Request.Files 从 POST 请求中检索文件名：

foreach (String name in Request.Files)
{
    StoryImg = this.Request.Files[name];
}

注意：HttpPostedFile 是一个sealed 类，与abstract 类HttpPostedFileBase 相比，其处理方式不同，甚至它们内部的属性和方法名称也有些相似。

Answer 2

您是否尝试使用 HttpPostedFileBase 而不是 HttpPostedFile？