MatBlazor select issue

Question

my code should be like this, but it's getting null reference exception

 <MatSelect Label="Atık Tipi" @bind-Value="@SecilenAtikGrubu.GrupId" Style="width:100%">
      @foreach (var item in TumAtikTipleri)
     {
        <MatOption Value="@item.Id">@item.Deger1</MatOption>
     }
 </MatSelect>

but when i use like this, it is working

  <select class="mdc-select__native-control" @bind="SecilenAtikGrubu.GrupId">
     @foreach (var item in TumAtikTipleri)
     {
         <option value="@item.Id">@item.Deger1</option>
     }
  </select>

Binding value class is like below (SecilenAtikGrubu and TumAtikTipleri)

 public class GrupKodlari : KayitBilgisi
{
    [Key]
    public int Id { get; set; }
    public string Tur { get; set; }
    public string Isim { get; set; }
    public string Deger1 { get; set; }
    public string Deger2 { get; set; }
    public string Deger3 { get; set; }
    public int? GrupId { get; set; } 
    public virtual GrupKodlari Grup { get; set; }

}

Have you made sure that none of the `GrupID`s are null? I suspect that MatSelect doesn't handle binding to a null value — Gerrit, Dec 26 '19 at 13:47
Yes, it works when GrupId is not null, but it should work with null value to. — lkmcelik, Dec 26 '19 at 14:00
Like I said, you don't really know what the `MatSelect` component is doing behind the scenes with the value. It probably doesn't expect a null value. I would suggest opening an issue on their [github](https://github.com/SamProf/MatBlazor/issues) — Gerrit, Dec 26 '19 at 14:07
Check out MudBlazor. It has a pretty good Select: https://mudblazor.com/components/select — henon, Oct 22 '20 at 18:20

score 8 · Accepted Answer · answered Dec 26 '19 at 19:58

The bad news are that, I have checked it and, MatSelect is unable to be binded to a nullable type.

Now the good news, first one, you can use an auxiliary property as a workaround, Try it at blazorfiddle.

public int GrupIdAux
{
    set{
        GrupId = (value==0?(int?)null:value);
    }
    get {
        return (GrupId==null?0:GrupId.Value);
    }
}

Second good new: MatBlazor is an opensource project. If you need to work with nullable types you can improve MatSelect control and send a PR. The project owner is open to contributions (for example I wrote NumericUpDown) If you can't improve component, you can pay someone to write it for you or you can post a request for the new feature on project issues. It looks like good idea, would be wonderful to bind nullable objects.

score 1 · Answer 2 · answered Feb 20 '21 at 00:39

@daniherrera You can bind MatSelect to a nullable type. However you have to specify that you accept a nullable type with ?. Example:

<MatSelect Label="Pick a Food Group" @bind-Value="@guidValue">
    <MatOption TValue="Guid?" Value="@(null)"></MatOption>
    <MatOption TValue="Guid?" Value="@(new Guid("20A82054-F493-4C7B-81A4-4F9A1EDD7C2E"))">Bread, Cereal, Rice, and Pasta</MatOption>
    <MatOption TValue="Guid?" Value="@(new Guid("4451642D-24F7-418F-8741-BA5089A1CC65"))">Vegetables</MatOption>
    <MatOption TValue="Guid?" Value="@(new Guid("5717DBBE-C205-4E33-9E07-892A51F64021"))">Fruit</MatOption>
</MatSelect>

<span>@guidValue</span>

@code
{
    Guid? guidValue = new Guid("20A82054-F493-4C7B-81A4-4F9A1EDD7C2E");
}

https://www.matblazor.com/Select#MatSelectGuid

Use int? Id and mark your MatOption with TValue="int?".

score 0 · Answer 3 · answered Nov 10 '21 at 18:06

0

My way to solve it is:

<MudSelect T="Genre?" Label="Genre Primary" @bind-Value="model.MainGenrePrimary" Variant="Variant.Outlined">
<MudSelectItem T="Genre?"></MudSelectItem>
@foreach (Genre item in Enum.GetValues(typeof(Genre)))
{
   <MudSelectItem T="Genre?" Value="@item">@item</MudSelectItem>
}
</MudSelect>

answered Nov 10 '21 at 18:06

Viet Anh Nguyen

1
1

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Nov 11 '21 at 05:10

MatBlazor select issue

3 Answers3