MudSelectExtended - Initially selected item not rendered if ItemsCollection is provided after OnAfterRenderAsync

[eMuonTau]

trafficstars

Hi,

#239 fixes situations where item collection is static or fast enough so it is loaded before OnAfterRenderAsync is called. But if you are loading data from a remote source, initially selected item is not rendered. I think it is because SelectedListItem is never reassigned after OnAfterRenderAsync.

https://github.com/CodeBeamOrg/CodeBeam.MudBlazor.Extensions/blob/c88d3286b438f4db1c043ca454fe69cc43774b56/CodeBeam.MudBlazor.Extensions/Components/SelectExtended/MudSelectExtended.razor.cs#L739

I think SelectedListItem should be set every time Value or ItemCollection parameters changed.

I also tried to use MudBlazor AutoComplete but looks like it doesn't support something like ValuePresenter.

@using MudExtensions.Enums

<MudSelectExtended ItemCollection="_players" @bind-Value="_selected" ValuePresenter="ValuePresenter.ItemContent" 
                    Placeholder="Template & ItemContent"Label="Select Player" 
                    Variant="Variant.Outlined" AnchorOrigin="Origin.BottomCenter">
    <ItemTemplate>
        <MudStack Class="mud-width-full" Justify="Justify.SpaceBetween">
            <MudText><b>@context.Value.Name</b></MudText>
            <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                <MudStack Row="true">
                    <MudIcon Icon="@Icons.Material.Outlined.Person" />
                    <MudText>@(context.Value.Retired == true ? "Retired" : "Active")</MudText>
                </MudStack>
                <MudChip Color="Color.Info" Variant="Variant.Outlined">Total Score: @context.Value.Score</MudChip>
            </MudStack>
        </MudStack>
    </ItemTemplate>
</MudSelectExtended>

@code {
    List<Player> _players = null;
    Player _selected = null;

    protected override async Task OnInitializedAsync() {
        _players = await LoadData();
        _selected = _players.FirstOrDefault();
    }

    private async Task<List<Player>> LoadData() {
        await Task.Delay(1000);
        return new List<Player>
        {
            new Player("Kareem Abdul-Jabbar", "38.387", true),
            new Player("LeBron James", "37.062", false),
            new Player("Karl Malone", "36.928", true),
            new Player("Kobe Bryant", "33.643", true),
            new Player("Michael Jordan", "32.292", true),
        };
    }
    private record Player {

        public Player(string name, string score, bool retired) {
            Name = name;
            Score = score;
            Retired = retired;
        }

        public string Name { get; set; }
        public string Score { get; set; }
        public bool Retired { get; set; }
    }
}

MudBlazor: 6.11.2 CodeBeam.MudBlazor.Extensions: 6.7.0

[chenhunglin]

MudBlazor: 7.11.0 CodeBeam.MudBlazor.Extensions: 7.0.2

Still had this issue

[pisc-software]

Same issue persists also on current 8.2.0. When using ValuePresenter.Text the selected item is shown correctly, but when using ValuePresenter.ItemTemplate the selcted value is correct, but an empty input is shown. The placeholder div is there instead of the ItemTemplate of the SelectedItem.

We are using it in a component that does load data from a database, and because of the life cycle of the component Value is null initially, but then updated with the correct Value. That change does not propagate to the select.

[MichaelCastano]

Yep, issue is still present. I thought i was going crazy for the ItemTemplate not showing up after loading from the DB and setting the value. But then i found this topic.

Is there any way this will be fixed or i can help fix this?