CODEWITHSUNDEEP
blazorblazor-server-sidemudblazor
Daniel
Daniel

Reputation: 393

MudChip two way binding in MudBlazor?

I'm using MudBlazor with Blazor Server side and I'm trying to double-bind a MudChip. I want to save the chip that is selected in a database and retrieve the data at a later point and prerender the chip as selected. Basically to do a double binding on the chip. It does no seems to work, what I have tried:

  1. Create a new chip in OnInitialized method and set the properties (Text, Color, IsSelected) on the SelectedChip property:

<MudContainer>
                  <MudText Style="display:inline;color:white">Goal Type</MudText>
                  <MudChipSet @bind-SelectedChip="md"  Style="display:inline;" Filter="true">
                      <MudChip  Text="Financial" Color="Color.Dark">Financial</MudChip>
                      <MudChip Text="Personal" Color="Color.Dark">Personal</MudChip>
                  </MudChipSet>
</MudContainer>

This is the code:

MudChip md;

  protected override void OnInitialized()
  {
        Init();
  }

  public void Init()
  {
        if (md == null)
        {
            md = new MudChip { Color = Color.Dark, Text = "Financial", IsSelected = true };
        }
  }
  1. Create a reference to the selected chip:

<MudChipSet @bind-SelectedChip="md" @onselect="OnSelect" Style="display:inline;" Filter="true">
                        <MudChip Text="Financial" Color="Color.Dark">Financial</MudChip>
                        <MudChip @ref="personal" Text="Personal" Color="Color.Dark">Personal</MudChip>
     </MudChipSet>

This is the code:

MudChip md;
 MudChip personal;

 protected override void OnInitialized()
 {
        if(md is null)
        {
            md = personal;
        }
 }

None of this methods worked, do you have any idea if double binding is even possible ? I also asked on the GitHub page and one of the contributors said that is possible, by using the provided examples. For me they weren't of much help. This is the GitHub question:

https://github.com/Garderoben/MudBlazor/discussions/1791

Upvotes: 3

Views: 2695

Answers (1)

Mister Magoo
Mister Magoo

Reputation: 9029

OnInitialized is fired before the first render, so personal will still be null when you set md=personal.

Move that code to OnAfterRender(bool firstRender) when firstRender is true

Upvotes: 3

Related Questions