1. Home
  2. Forum
  3. Blazor
  4. Blazor WebAssembly ComboBox validation

Blazor WebAssembly ComboBox validation

Trying to make mandatory combobox field value (AssignedTo), but form validation accepts when value is not entered.

<EditForm  Model="@model" OnValidSubmit="@Create">
                <SfComboBox TValue="int"
                            TItem="User"
                            DataSource="@Users"
                            AllowCustom="false"
                            @bind-Value="@model.AssignedTo"
                            ShowClearButton="true"
                            Autofill="true">
                    <ComboBoxFieldSettings Text="Name" Value="ID"></ComboBoxFieldSettings>
                </SfComboBox>
                <SfTextBox Placeholder="Title" @bind-Value="model.Title"/>
            </div>
            <ValidationSummary />
          <button type="submit" >Create</DhButton>
</EditForm>

        

 public class Model
    {
        [Required]
        public int AssignedTo{ get; set; }
        [Required]
        public string Title { get; set; }
    }

public class User
    {
        public int ID { get; set; }
        public string Name { get; set; }
    }

    public List<User> Users = new List<User>()
    {
        new User() { ID = 1, Name = "a a" },
        new User() { ID = 4, Name = "b b" },
        new User() { ID = 5, Name = "c c" }
    };

 protected override async Task OnInitializedAsync()
    {
        model = new Model();
        await base.OnInitializedAsync();
    }

3 Replies 1 reply marked as answer
SN Sevvandhi Nagulan Syncfusion Team November 17, 2020 10:00 AM UTC

Hi Roberta, 


Greetings from Syncfusion support. 

We would like to inform you that by default ComboBox will be rendered based on the provided TValue type. If you are rendered the ComboBox with TValue as int, then it will be rendered the component with default value of the int type which is 0 in C# . So model class hold the value as zero for int type field. Hence the validation is not working.  We suggest you to provide the TValue as int Nullable(int?)  as well as the model field type as mentioned in the below code example. 


EditForm Model="@model" OnValidSubmit="@Create"> 
        <SfComboBox TValue="int?" 
                    TItem="User" 
                    DataSource="@Users" 
                    AllowCustom="false" 
                    @bind-Value="@model.AssignedTo" 
                    ShowClearButton="true" 
                    Autofill="true"> 
            <ComboBoxFieldSettings Text="Name" Value="ID"></ComboBoxFieldSettings> 
        </SfComboBox> 
        <SfTextBox Placeholder="Title" @bind-Value="model.Title" /> 
        <ValidationSummary /> 
 
        <button type="submit">Create</button> 
    </EditForm> 
 
@code{ 
 
    public Model model { get; set; } 
 
    public class Model 
    { 
        [Required] 
        public int? AssignedTo { get; set; } 
        [Required] 
        public string Title { get; set; } 
    } 
 
    public class User 
    { 
        public int? ID { get; set; } 
        public string Name { get; set; } 
    } 
 
    public List<User> 
    Users = new List<User>() 
    { 
        new User() { ID = 1, Name = "a a" }, 
        new User() { ID = 4, Name = "b b" }, 
        new User() { ID = 5, Name = "c c" } 
            }; 
 
    protected override async Task OnInitializedAsync() 
    { 
        model = new Model(); 
        await base.OnInitializedAsync(); 
    } 
 
    public void Create() 
    { 
 
    } 
} 

 


Please find the sample below, 




Let us know if you need any further assistance on this.  


Regards,  
Sevvandhi N 


Marked as answer
RO Roberta November 19, 2020 01:30 PM UTC

Worked, thank You for quick reply!

SN Sevvandhi Nagulan Syncfusion Team November 20, 2020 05:27 AM UTC

Hi Roberta, 


Thanks for the update. Please let us know if you need further assistance. 

Regards, 
Sevvandhi N 


Loader.
Up arrow icon