Radzen validators in nested components

Hello! I'm creating a component with RadzenTemplateForm like this:

<RadzenTemplateForm 
    Data="@Item" 
    TItem="ItemClass" 
    Visible=@FormIsVisible 
    Submit=@(_ => SubmitForm()) >

    <CustomComponent />

</RadzenTemplateForm>

So, in the CustomComponent I have some fields with different Radzen validators, such as RadzenRequiredValidator, for instance. Since it is written in docs, the required validators don't work because they are situated out of scope of RadzenTemplateWork, as the runtime thinks, apparently. But they are, though! Is here any workaround to induce it to work?

Hi @masleshov,

You should pass the Item property somehow to the CustomComponent. I tested the following which seems to work as expected.

Form.razor:

 <RadzenTemplateForm TItem="Model" Data=@model >
    <TestValidator Model=@model />
</RadzenTemplateForm>

TestValidator.razor:

<RadzenTextBox Name="FirstName" @bind-Value=@Model.FirstName />
<RadzenRequiredValidator Component="FirstName" Text="FirstName is required"/>

@code {
    [Parameter]
    public RequiredValidatorConfig.Model Model { get; set; }
}

Hello! Thanks for the quick response!

I found the problem. My case is more complex and it caused the issue:

<RadzenTemplateForm 
    Data="@Item" 
    TItem="ItemClass" 
    Visible=@FormIsVisible 
    Submit=@(_ => SubmitForm()) >

    <CustomComponent Model=@Item.Field1 />
    <CustomComponent Model=@Item.Field2 />

</RadzenTemplateForm>

<CustomComponent>
    <RadzenTextBox Name="FirstName" @bind-Value=@Model.FirstName />
    <RadzenRequiredValidator Component="FirstName" Text="FirstName is required"/>
</CustomComponent>

The issue occurred when I left controls empty at the second CustomComponent while the same controls at the first one were filled. Since the textboxes inside have the same names, validation works only for the first one. So, to mitigate it, I have to add some component id to my CustomComponent and to use it in control names.

Probably it will help to someone once :slight_smile: