SfAutoComplete binding not displaying value

Question

I'm having an issue regarding SfAutoComplete. I have an AutoCompleteEvent action but it is not showing on the input that I bind the variable to. Please see attached links.

SFAutoComplete:

<SfAutoComplete EnableVirtualization="true" ShowPopupButton="true" class="form-control form-control-sm" 
                                                                                TItem="ProductDetailsModel" TValue="string" 
                                                                                DataSource="@SelectedProductDetails" @bind-Value=@(InvoiceDetails.ProductDetailUOM)>
                                                                                <AutoCompleteEvents TItem="ProductDetailsModel" TValue="string" OnValueSelect="ProductUOMValueSelectHandler"></AutoCompleteEvents>
                                                                                <AutoCompleteFieldSettings Value="UOM" Text="UOM"></AutoCompleteFieldSettings>
                                                                            </SfAutoComplete>
                                                                            <ValidationMessage For="() => InvoiceDetails.ProductDetailUOM" />

SFAutoCompleteAction:

private async Task ProductUOMValueSelectHandler(SelectEventArgs<ProductDetailsModel> args)
        {
            //modify once found out how to
            var selectedValue = args.ItemData;
            dbProductDetailPrice = selectedValue.Price.ToString();

            StateHasChanged();


        }

Input Field Bind:

<input class="form-control form-control-sm" type="number" @bind-value=@(dbProductDetailPrice) />

I want the price to appear in the input field whenever I select a Product UOM. Please help. I am stuck in here for a week now but I can't find a solution to my problem.