I’m working with a MudChipField in Blazor. I have implemented a method ClearChipAsync that should clear the SearchText and the Values in the MudChipField. However, while the SearchText value is set to an empty string in the method, it does not visually clear in the UI.
<div id="MTIChipSearchField">
<MudChipField T="string" Class="mud-chip-search"
Values="@Values" ValuesChanged="@((value) => ChipValuesChangedAsync(value))"
Value="@SearchText" ValueChanged="@SearchValueChangeAsync"
Placeholder="@Localizer["Search"]" Variant="Variant.Outlined"
ChipSize="Size.Medium" WrapChips="true"
Delimiter="@Delimiter" ChipColor="Color.Default"
ChipVariant="Variant.Text" Closeable="true"
OnBlur="HandleBlurAsync">
</MudChipField>
@if (Values.Count > 0)
{
<div class="clear-chip">
<MudTooltip Text="Clear All">
<MudIconButton Icon="@Icons.Material.Outlined.Clear" OnClick="@ClearChipAsync"></MudIconButton>
</MudTooltip>
</div>
}
</div>
private async Task ClearChipAsync()
{
_isClearing = true;
SearchText = string.Empty;
Values.Clear();
await ChipValuesChanged.InvokeAsync(Values);
await SearchValueChanged.InvokeAsync(SearchText);
await ClearChipValues.InvokeAsync();
_isClearing = false;
StateHasChanged();
}
Additional Information:
- The Values collection and chips are cleared correctly.
- The method SearchValueChanged.InvokeAsync(SearchText) is called to update the MudChipField.
What I’ve Tried:
- Confirmed that SearchText is indeed set to an empty string.
- Verified that StateHasChanged is called after setting the SearchText.
Does anyone have an idea why the SearchText is not clearing visually and how to resolve this issue?
New contributor
Aishwarya S is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.