带有子视图的模型视图，其中子视图充当强类型部分视图的模型 [英] View with model that has children that act as model for strongly typed partial views

问题描述

我有一个包含启动表单的主页的系统:

I have a system consisting of main page that starts a form:

@model Stuvo_Intakeformulier.Models.CaterRequest

@using (Html.BeginForm(null, null, FormMethod.Post, new { id="fooData", @class="form-horizontal", role="form"}))
        {
         <div id="generalInfo" style="display:none">
              @{Html.RenderPartial("Food", Model.foodInfo);}
         </div>

         <div id="studyInfo" style="display:none">          
               @{Html.RenderPartial("Drinks", Model.drinkInfo);}
               <input type="submit" value="Bevestigen">
        ....

使用父模型

public class CaterRequest
{
    public CaterRequest()
    {
        foodInfo = new Food();
        drinkInfo = new Drinks();
    }

   public Food foodInfo { get; set; }
   ....

像这样的子模型:

public class Food
{
    [Required(ErrorMessage = "BlaBla")]
    public string name { get; set; }
}

最后，局部视图如下所示:

Finally, the partial view looks like this:

@model Stuvo_Intakeformulier.Models.Food

<div class="form-group">    
        @Html.LabelFor(model => Model.name, "Naam: ", htmlAttributes: new { @class = "col-sm-2 control-label" })
        <div class="col-sm-10">
            @Html.TextBoxFor(model => Model.name, null ,htmlAttributes: new { @class = "form-control" })
        </div>
        <div class="col-sm-offset-2 col-sm-10">
            @Html.ValidationMessageFor(model => Model.name)
        </div>
    </div>

很显然，在发布我的模型时，foodInfo.name将为空，因为在我的局部视图中，name属性是 name 而不是 foodInfo.name .我可以通过使用 @ Html.TextBox('foodInfo.name'更改 @ Html.TextBoxFor(model => Model.name .. 我的强类型局部视图(尤其是客户端验证，这是我绝对需要的东西)的优点.

Obviously when posting my model.foodInfo.name will be empty because of the fact that in my partial views the name attribute is name instead of foodInfo.name. I can solve this by changing @Html.TextBoxFor(model => Model.name.. with @Html.TextBox('foodInfo.name' but then I lose all the advantages of my strongly typed partial view (especially the client side validation, which is something I absolutely need to have).

我想知道对这个问题最好的解决方案是什么?有没有简单的方法来解决这个问题?什么是最干净的解决方案?

I was wondering what the best solution to this problem would be? Is there an easy way to solve this? What is the cleanest solution?

基本上，我想将我的强类型局部视图中的数据绑定到我的普通视图中的模型，同时仍保留强类型视图和验证内容.

Basically I want to bind the data from my strongly typed partial views to my model in my normal view, while still maintaining the strongly typed views and validation stuff.

推荐答案

我们使用 DisplayFor 和 EditorFor 模板.它干净，并具有您提到的所有功能.我们的工作代码与此链接.

We use DisplayFor and EditorFor template. Its clean and comes with all features you mentioned. We have working code that is quite similar to this link.

因此，在上面的示例中，您将需要创建一个Food.cshtml，其中可以包含与您所拥有的内容类似的内容:

So in you example above, you will need to create a Food.cshtml that can contain similar to what you have:

@model Stuvo_Intakeformulier.Models.Food

    <div class="form-group">    
                @Html.LabelFor(model => Model.name, "Naam: ", htmlAttributes: new { @class = "col-sm-2 control-label" })
                <div class="col-sm-10">
                    @Html.TextBoxFor(model => Model.name, null ,htmlAttributes: new { @class = "form-control" })
                </div>
                <div class="col-sm-offset-2 col-sm-10">
                    @Html.ValidationMessageFor(model => Model.name)
                </div>
</div>

Food.cshtml 文件必须放在"Shared/EditorTemplates/"文件夹中.

Above Food.cshtml file has to be placed into the "Shared/EditorTemplates/" folder.

然后在您的主页上可以按以下方式调用:

Then in your main page you can call like:

 <div id="generalInfo" style="display:none">
      @Html.EditorFor(m => m.foodInfo)
 </div>

顺便说一句，您是否在 public string foodInfo {get;中有错字?放;} ，它应该是 public Food foodInfo {get;放;} ?

As a aside, Do you have a typo in public string foodInfo { get; set; }, it should be public Food foodInfo { get; set; }?

这篇关于带有子视图的模型视图，其中子视图充当强类型部分视图的模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！