Skip to content

MatSelect options dont show when loaded as disabled then changed dynamically to not be disabled #943

Open
@liamkavfc

Description

@liamkavfc

Describe the bug

I have a blazor app where I am using the MatSelect component.

I have a Disabled State based on a couple of booleans like so:

<MatSelect TValue="Guid" 
           @bind-Value="@SomeViewModel.Customer"
           Disabled="@(!IsAdmin || HasProducts)">
    <MatOption Value="new Guid()" Disabled="true">Please select</MatOption>
    @foreach(var customer in AvailableCustomers)
    {
        <MatOption Value="customer.Id">@customer.Name</MatOption>
    }
</MatSelect>

So basically the customer field is editable for admin users and only if the customer has no products (This is a sample scenario loosely based on what I'm building). When the page is loaded and Disabled is false, I can click the MatSelect box and get my dropdown options no problem, but if its loaded and Disabled is true, when removing the products, thus making the Disabled state false, the field becomes clickable again but my dropdown list doesn't show.

Now just to confirm, the AvailableCustomers List IS populated and I can see the html in the page, just that it isn't becoming visible.

What I have already tried
I have a method to remove products from the SomeViewModel which I also tried adding StateHasChanged() and this still didn't work.

public void RemoveProduct(
    ProductListViewModel productListViewModel)
{
    SomeViewModel.Products.Remove(productListViewModel);

    // Notify EditContext of the change
    FormEditContext.NotifyFieldChanged(FieldIdentifier.Create(() => SomeViewModel.Product));

    CheckForDuplicateProducts();

    // Didnt work
    // StateHasChanged();
}

To Reproduce
Steps to reproduce the behavior:

  1. Load MatSelect with a bool bound to Disabled which is true, then programmatically update that bool to be false
  2. Click MatSelect field and observe that the options do not appear as they should

Blazorfiddle link
https://blazorfiddle.com/s/kinehghl

Expected behavior
The dropdown options should display when the MatSelect Field becomes Enabled again

Screenshots
N/A

Additional context
N/A

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions