When a phrase has been entered but the space bar has not been pressed, the search needs to be initiated if the search textbox loses focus. To address this, I have implemented the HandleBlurAsync method. While I am able to add the chip values, the current SearchText is not being cleared after adding it to the chip set.
<MudChipField T="string" Values="@Values" ValuesChanged="@((value) => ChipValuesChangedAsync(value))"
Value="@SearchText" ValueChanged="@((value) => SearchValueChangeAsync(value))"
StyleChip="@(_disableRadius ? "border-radius: 0 !important" : null)" Delimiter="@_delimiter" FullWidth="true" Disabled="_disabled" ReadOnly="_readonly"
ChipColor="_color" ChipVariant="_chipVariant" ChipSize="_chipSize" WrapChips="_wrapChips" MaxChips="_maxChips" ChipsMaxWidth="_chipsMaxWidth"
Closeable="_closeable" Variant="_variant" Label="ChipField" OnBlur="@(async (value) =>await HandleBlurAsync(value))" />
@code {
char _delimiter = ' ';
int _maxChips = 0;
int _chipsMaxWidth = 80;
Color _color = Color.Default;
Variant _chipVariant = Variant.Filled;
Variant _variant = Variant.Outlined;
Size _chipSize = Size.Medium;
bool _wrapChips = true;
bool _disabled = false;
bool _readonly = false;
bool _disableRadius = false;
bool _closeable = true;
/// <summary>
///List Values of the chip control.
/// </summary>
[Parameter]
public List<string> Values { get; set; } = [];
/// <summary>
///Input string for search filtering.
/// </summary>
[Parameter]
public string? SearchText { get; set; }
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
}
private async Task SearchValueChangeAsync(string? value)
{
SearchText = value;
await Task.Yield();
}
/// <summary>
/// Event when the chip list changes.
/// </summary>
/// <param name="values">list value from the chipset.</param>
/// <return>Task</return>
private async Task ChipValuesChangedAsync(List<string> values)
{
Values = values.Select(v => v.Trim()).Where(v => !string.IsNullOrWhiteSpace(v)).Distinct().ToList();
await Task.Yield();
}
private async Task HandleBlurAsync(FocusEventArgs e)
{
if (!string.IsNullOrWhiteSpace(SearchText))
{
Values.Add(SearchText);
await ChipValuesChangedAsync(Values);
SearchText = null;
await SearchValueChangeAsync(null);
StateHasChanged();
}
}
}
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.