英文:
Can a child element pass validation issues up to the <DataAnnotationsValidator> in the parent
问题
我将代码部分排除,只提供翻译:
我正在将这简化为必要的部分。如果我简化得太多,请询问详情。
我有一个如下的剃刀页面:
<EditForm>
<DataAnnotationsValidator />
<AddressForm @ref="_addressElement"
Value="@Model.AddressForm"
ValueChanged="OnAddressSelected">
</AddressForm>
<ValidationSummary />
</EditForm>
这是AddressForm.razor:
<DxTextBox @bind-Text="@Model.StreetNumberAndName" ShowValidationIcon="true" />
这是它的模型属性:
[Required(ErrorMessage = "Your street address is required")]
public string? StreetNumberAndName
{
get => _streetNumberAndName;
set => _streetNumberAndName = value?.Trim();
}
这是我的问题。如何将[Required]
验证消息从<AddressForm>
移到父级razor/component中的<DataAnnotationsValidator>
?
英文:
I'm reducing this down to the essentials. If I reduced too much, please ask for detail.
I have a razor page as follows:
<EditForm>
<DataAnnotationsValidator />
<AddressForm @ref="_addressElement"
Value="@Model.AddressForm"
ValueChanged="OnAddressSelected">
</AddressForm>
<ValidationSummary />
</EditForm>
And here is AddressForm.razor
<DxTextBox @bind-Text="@Model.StreetNumberAndName" ShowValidationIcon="true" />
And here is it's model property
[Required(ErrorMessage = "Your street address is required")]
public string? StreetNumberAndName
{
get => _streetNumberAndName;
set => _streetNumberAndName = value?.Trim();
}
Here's my question. How can I get the [Required]
validation messages up/out of <AddressForm>
and to the <DataAnnotationsValidator>
in the parent razor/component?
答案1
得分: 0
致敬 Zhi Lv,他给了我这个。这一切都来自他 - 他应该得到这个荣誉。
要验证绑定模型的整个对象图,包括集合和复杂类型属性,请使用实验性的 Microsoft.AspNetCore.Components.DataAnnotations.Validation 包提供的 ObjectGraphDataAnnotationsValidator(注意:如果要通过“管理 Nuget 包...”安装此包,需要选中“包括预发行版本”选项)。
参考以下示例:
模型:请注意,我们正在为导航属性使用 ValidateComplexType 属性。
public class TestModel
{
[Required(ErrorMessage = "请输入名称")]
public string Name { get; set; }
[ValidateComplexType]
public AddressViewModel AddressForm { get; set; }
}
public class AddressViewModel
{
private string _streetNumberAndName;
[Required(ErrorMessage = "需要您的街道地址")]
public string? StreetNumberAndName
{
get => _streetNumberAndName;
set => _streetNumberAndName = value?.Trim();
}
}
父组件:使用 ObjectGraphDataAnnotationsValidator 而不是 DataAnnotationsValidator。
@page "/testpage"
@using BlazorServerApp3.Data
<EditForm Model="Model">
<ObjectGraphDataAnnotationsValidator />
<AddressForm @ref="_addressElement" testModel="Model"></AddressForm>
<ValidationSummary />
<div class="mt-n2">
<button type="submit" class="btn btn-primary mr-2">保存</button>
</div>
</EditForm>
@code{
TestModel Model = new TestModel() { AddressForm = new AddressViewModel() };
AddressForm _addressElement;
}
子组件:
@using BlazorServerApp3.Data;
<h3>AddressForm</h3>
<input type="text" @bind="testModel.Name" />
<input type="text" @bind="testModel.AddressForm.StreetNumberAndName" />
@code {
[Parameter]
public TestModel testModel { get; set; }
}
英文:
Hat tip to Zhi Lv who gave me this. This is all from him - he deserves the credit for this.
To validate the bound model's entire object graph, including collection- and complex-type properties, use the ObjectGraphDataAnnotationsValidator provided by the experimental Microsoft.AspNetCore.Components.DataAnnotations.Validation package (Note: you need to checked the "include prerelease" option if you want to install this package via "Manage Nuget Package..." ).
Refer to the following sample:
Model: Note: we are using the ValidateComplexType attribute for the navigation property.
public class TestModel
{
[Required (ErrorMessage ="Please enter the Name")]
public string Name { get; set; }
[ValidateComplexType]
public AddressViewModel AddressForm { get; set; }
}
public class AddressViewModel
{
private string _streetNumberAndName;
[Required(ErrorMessage = "Your street address is required")]
public string? StreetNumberAndName
{
get => _streetNumberAndName;
set => _streetNumberAndName = value?.Trim();
}
}
Parent component: using ObjectGraphDataAnnotationsValidator instead of DataAnnotationsValidator.
@page "/testpage"
@using BlazorServerApp3.Data
<EditForm Model="Model">
<ObjectGraphDataAnnotationsValidator />
<AddressForm @ref="_addressElement" testModel="Model"></AddressForm>
<ValidationSummary />
<div class="mt-n2">
<button type="submit" class="btn btn-primary mr-2">Save</button>
</div>
</EditForm>
@code{
TestModel Model = new TestModel() { AddressForm= new AddressViewModel()};
AddressForm _addressElement;
}
Child Component:
@using BlazorServerApp3.Data;
<h3>AddressForm</h3>
<input type="text" @bind="testModel.Name" />
<input type="text" @bind="testModel.AddressForm.StreetNumberAndName" />
@code {
[Parameter]
public TestModel testModel { get; set; }
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论