CodeBeam.MudBlazor.Extensions icon indicating copy to clipboard operation
CodeBeam.MudBlazor.Extensions copied to clipboard

MudSelectExtended with Virtualize and MultiSelect doesn't initialise the Text property

Open fighterii opened this issue 2 years ago • 2 comments
trafficstars

I have the following weird behavior.

Following minimal example for

<MudSelectExtended T="string"       
                @ref="_releases"
                   SearchBox="true" 
                   Label="Features" 
                   ItemCollection="featureOptions"
                   @bind-SelectedValues="features"
                   SearchBoxAutoFocus="true" 
                   SearchBoxClearable="true" 
                   Variant="Variant.Outlined"
                   ValuePresenter="MudExtensions.Enums.ValuePresenter.Chip"
                   Virtualize="true"
                   ChipCloseable="true"
                   ChipSize="Size.Small"
                   ChipVariant="Variant.Text"     
                   Required="true"
                   MultiSelection="true" />
<MudText>SelectedValues: @_releases.SelectedValues.Count()</MudText>
<MudText>Text Value: @_releases.Text</MudText>

@code {
    public List<string> featureOptions;
    public IEnumerable<string> features;
    private MudSelectExtended<string> _releases;

    protected override async Task OnInitializedAsync()
    {
        featureOptions = new List<string> { "Feature 1", "Feature 2", "Feature 3" };
        features = new List<string> { "Feature 1"};
        await base.OnInitializedAsync();
    }
}

As you can see i have a ItemCollection assigned for all possible features (populated in OnInitializedAsync).

The features list has one feature preselected. features = new List<string> { "Feature 1"}

If i now start the MudDialog the rendered MudSelectExtended acts as if no Feature is selected (e.g. Label is shown above the Chip!). image If i select a second Feature ("Feature 2") the label behaves correctly and is shown above the box. image If i now deselect "Feature 1" (so only "Feature 2" is selected) the Component behaves again like nothing is selected (at least on my local instance. On https://trymudextensions.pages.dev/snippet it bevaces correctly) . image

So i think somehow the Count of the binded values is not taken in account correctly at startup. But as you can see in the example, the SelectedItems.Count() is set correctly.

fighterii avatar Oct 26 '23 08:10 fighterii

I narrowed it down to the css transitition when the "mud-shrink" class is added to the input div. This somehow isn't added. As I would assume from https://github.com/CodeBeamOrg/CodeBeam.MudBlazor.Extensions/blob/dev/CodeBeam.MudBlazor.Extensions/Components/InputExtended/MudInputExtended.razor.cs#L17C19-L17C19 the class is added if the Text is not null or the converter is returning a not null.

As you can see in the example when the page is loaded the _releases.Text indeed returns a null value. After I change the values the Text Value is correctly set.

  • Why isn't the Text Property updated on initializiation?
  • How can i manually trigger that? Even with ForceUpdate() the Text Property isn't updated correctly.

However this only seems to be a problem when Virtualize="true". With no Virtualization Text is still empty, but there aren't any render issues. With no MultiSelect (but Virtualize="true") the Text Property is set correctly on initialization.

fighterii avatar Oct 26 '23 10:10 fighterii

Workaround from #109 with using a custom MultiSelectionTextFunc works.

fighterii avatar Oct 27 '23 07:10 fighterii