c# - 使用 MVC 将部分 View 和模型绑定(bind)在同一页面上的多个实例

Question

我在一个 View 上有两次部分。 Partial 不使用循环并具有基本验证。

这是部分 View 代码:

 <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; }
    }

然后有一个单独的 Address 类...

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 显示了问题...邮件地址 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

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

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

正如您从上面的标记中看到的，id 和 name 属性必须完全限定所绑定(bind)的模型属性。

上面的问题可以通过在渲染 Address 部分页面时使用 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" } })