How to use <InputSelect> inside component with eventCallback

Ramzi Sahawneh 20 Reputation points
2024-03-28T23:01:56.2866667+00:00

I am using Blazor Server , in the following code i Use <inputSelect > , the selection is getting passed to the parent component, but the element it self does not get updated for the selection

@* Select Filter Property *@
@if (SelectionProperties != null)
{
 
    <div class="col-2">
        <div class="d-flex mb-1 me-1">
 
            <InputSelect class="form-select form-select-sm"
                         TValue="string"
                         Value="@SelectedFilterString"
                         ValueChanged="@(PassFilterValue)"
                         ValueExpression="@( () => SelectedFilterString )">
                <option value="0" disabled="disabled" selected>Filter By</option>
                @foreach (var obj in SelectionProperties)
                {
                    <option value="@obj">- @obj</option>
                }
            </InputSelect>
 
        </div>
    </div>
 
 
}
 
@code {
    private string? SelectedFilterString { get; set; }
 
    [Parameter]
    public List<string>? SelectionProperties { get; set; } = new();
    [Parameter]
    public EventCallback<string> ReturnedFilterProp { get; set; }
 
    private async Task PassFilterValue(string filterProp)
    {
        await ReturnedFilterProp.InvokeAsync(filterProp);
        SelectedFilterString = filterProp;
    }
}

Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,391 questions
{count} votes