Mickey
February 22, 2023, 3:39pm
1
Hi,
It seems like we're having the same issue as described here:
opened 12:31PM - 10 Mar 22 UTC
closed 10:38AM - 15 Jun 22 UTC
Hi everyone,
I have a problem using the RadzenRequiredValidator.
When I use… multiple input-fields with the same property name, then all validators with that property name will fire when I change one.
See this as an example:
When I change the value of the field "PhonePrefix" from null (unset) to 1 (or any other value) the other validators are fired. That's not what I want. The component names of the validators and the names of the RadzenTextBoxes match each other, but are all different. Even with different classes, for example PhoneNumberWithCountryCode the error occurs.
Here is my full source of Index.razor:
\@page "/"
\@using System.ComponentModel.DataAnnotations
\<PageTitle>Index\</PageTitle>
\<h1>ValidatorTest\</h1>
\<h3>@_formIsValidText\</h3>
\<br />
\<br />
\<RadzenTemplateForm TItem="ContactData" Data="_contactData" Submit="FormSubmit" InvalidSubmit="InvalidSubmit">
\<DataAnnotationsValidator />
\<ValidationSummary />
<span style="display: flex;">
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("PhonePrefix *")" />
<RadzenTextBox @bind-Value="_contactData.Phone.Prefix" Name="PhonePrefix" />
<RadzenRequiredValidator Component="PhonePrefix" Text="PhonePrefixIsRequired" />
</span>
<span style="width: 50px; display: grid;"></span>
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("PhoneNumber *")" />
<RadzenTextBox @bind-Value="_contactData.Phone.Number" Name="PhoneNumber" />
<RadzenRequiredValidator Component="PhoneNumber" Text="PhoneNumberIsRequired" />
</span>
</span>
<br />
<span style="display: flex;">
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("FaxPrefix")" />
<RadzenTextBox @bind-Value="_contactData.Fax.Prefix" Name="FaxPrefix" />
</span>
<span style="width: 50px; display: grid;"></span>
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("FaxNumber")" />
<RadzenTextBox @bind-Value="_contactData.Fax.Number" Name="FaxNumber" />
</span>
</span>
<br />
<span style="display: flex;">
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("MobilePrefix *")" />
<RadzenTextBox @bind-Value="_contactData.Mobile.Prefix" Name="MobilePrefix" />
<RadzenRequiredValidator Component="MobilePrefix" Text="MobilePrefixIsRequired" />
</span>
<span style="width: 50px; display: grid;"></span>
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("MobileNumber *")" />
<RadzenTextBox @bind-Value="_contactData.Mobile.Number" Name="MobileNumber" />
<RadzenRequiredValidator Component="MobileNumber" Text="MobileNumberIsRequired" />
</span>
</span>
<br/>
<span style="display: flex;">
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("InternationalPhonePrefix *")" />
<RadzenTextBox @bind-Value="_contactData.InternationalPhone.Prefix" Name="InternationalPhonePrefix" />
<RadzenRequiredValidator Component="InternationalPhonePrefix" Text="InternationalPhonePrefixIsRequired" />
</span>
<span style="width: 50px; display: grid;"></span>
<span style="width: 50%; display: grid;">
<RadzenLabel Text="@("InternationalPhoneNumber *")" />
<RadzenTextBox @bind-Value="_contactData.InternationalPhone.Number" Name="InternationalPhoneNumber" />
<RadzenRequiredValidator Component="InternationalPhoneNumber" Text="InternationalPhoneNumberIsRequired" />
</span>
</span>
<br/>
<RadzenButton Text="Submit" ButtonType="ButtonType.Submit" />
\</RadzenTemplateForm>
@code
{
private readonly ContactData _contactData = new();
private string _formIsValidText = "Form not yet submitted";
private void FormSubmit()
{
_formIsValidText = "Form is valid!";
}
private void InvalidSubmit()
{
_formIsValidText = "Form is invalid!";
}
public class ContactData
{
public PhoneNumber Phone { get; set; } = new();
public PhoneNumber Fax { get; set; } = new();
public PhoneNumber Mobile { get; set; } = new();
public PhoneNumberWithCountryCode InternationalPhone { get; set; } = new();
}
public class PhoneNumber
{
public string Prefix { get; set; }
public string Number { get; set; }
}
public class PhoneNumberWithCountryCode
{
public string CountryCode { get; set; }
public string Prefix { get; set; }
public string Number { get; set; }
}
}
We have multiple dropdowns bound as described below:
<RadzenDropDown Name="abc" TValue="int?" Data="class.xyz.Items" @bind-Value="class.abc.SelectedItemId" ValueProperty="Id" TextProperty="Value" />
<RadzenDropDown Name="def" TValue="int?" Data="class.xyz.Items" @bind-Value="class.def.SelectedItemId" ValueProperty="Id" TextProperty="Value" />
A single dropdown change triggers the validation of all dropdowns, is it possible to apply the suggested change from RangerPascalJ?
Thanks
korchev
February 22, 2023, 4:35pm
2
We never understood what the suggested change was so we can't apply it. As far as we know this is how the built-in Blazor validation works and we are not aware of a workaround.
Mickey
February 23, 2023, 8:16am
3
Goodmorning @korchev ,
I tested the suggested change and it solves the described problem (from RangerPascalJ and me).
Thanks
korchev
February 23, 2023, 8:29am
4
You can submit a pull request and we will check the suggested change and see if it doesn't break anything.