使用 MVC 在同一页面上的多个部分视图和模型绑定实例

Question

我有一个局部的两次视图。部分不使用循环并具有基本验证。

这里是部分查看代码：

 <div class="col-md-4">
                    @Html.LabelFor(model => model.ZipCode, new { @class = "control-label " })
                    @Html.TextBoxFor(model => model.ZipCode, new { @class = "form-control ",  tabindex = "4" })
                    @Html.ValidationMessageFor(model => model.ZipCode)
                </div>

这是我的主视图两次调用：

<div id="homeaddress">
                                @if (Model == null)
                                {
                                @Html.Partial("~/Views/AddrPartial.cshtml", new Address())
                            }
                            else
                            {
                                @Html.Partial("~/Views/AddrPartial.cshtml", Model.HomeAddress)
                            }
                        </div>

<div id="mailingaddress">
                                @if (Model == null)
                                {
                                    @Html.Partial("~/Views/AddrPartial.cshtml", new Address())
                                }
                                else
                                {
                                    @Html.Partial("~/Views/AddrPartial.cshtml", Model.MailingAddress)
                                }
                            </div>

那么只有“homeadrress” div 验证有效...这是我的模型的设置方式：

    public class Information
   {
    public Address HomeAddress { get; set; }
    public Address MailingAddress { get; set; }
    }

然后有一个单独的地址类...

public class Address
{
        [Display(Name = "Address")]
        public string Addr1 { get; set; }
        [Display(Name = "Address 2")]
        public string Addr2 { get; set; }
        [Display(Name = "Zip Code")]
        [RegularExpression(@"^\d{5}(-\d{4})?|^$", ErrorMessage = "Invalid Zip Code")]
        public string ZipCode { get; set; }

}

生成的 html 显示了问题... mailingaddress html 没有检查验证所需的正则表达式..

<input class="form-control " data-val="true" data-val-regex="Invalid Zip Code" data-val-regex-pattern="^\d{5}(-\d{4})?|^$" id="ZipCode_home" name="ZipCode_home"  tabindex="4" type="text" value="12345">
<span class="field-validation-valid" data-valmsg-for="ZipCode_home" data-valmsg-replace="true"></span>

<input class="form-control " id="ZipCode_mailing" name="ZipCode_mailing"  tabindex="4" type="text" value="54321">
<span class="field-validation-valid" data-valmsg-for="ZipCode_mailing" data-valmsg-replace="true"></span>

查看此代码后，我的问题是为什么会发生这种情况以及如何解决此问题。在此先感谢，如果需要，我可以回答问题并提供更多代码。

Answer 1

这是因为您正在渲染地址部分页面的两个实例。模型绑定框架要求 HTML 字段遵循此命名约定，模型绑定才能按预期工作

<input id="ShippingAddress_Street1" 
   name="ShippingAddress.Street1" type="text" value="" />
<input id="BillingAddress_Street1" 
   name="BillingAddress.Street1" type="text" value="" />

从上面的标记可以看出，id 和 name 属性必须完全限定被绑定的模型属性。

上述问题可以通过在渲染地址部分页面时使用 Partial() 助手的变体来解决

Html.Partial("_Address", 
new ViewDataDictionary() 
{ 
     TemplateInfo = new TemplateInfo() 
      { HtmlFieldPrefix = "ShippingAddress" } })

<h3>Billing Address</h3>
@Html.Partial("_Address", 
new ViewDataDictionary() 
{ 
    TemplateInfo = new TemplateInfo() 
       { HtmlFieldPrefix = "BillingAddress" } })

Answer 2

由于某种原因，上面的代码对我不起作用，所以我最终写成如下：

@Html.Partial("_Address",
                 Model?.Form?.BillingAddress,
                 new ViewDataDictionary(ViewContext.ViewData)
                 {
                     TemplateInfo = { 
                                      HtmlFieldPrefix = "billing",
                                      FormattedModelValue = "Billing address" 
                                    }
                 })

我使用FormattedModelValue 来存储标签，因为相同的视图用于生成公司地址和帐单地址。

希望有帮助