@bind-Value issue

[RonGramann]

I am new to Blazor, so forgive me if this issue is not related to your control.
I have a Blazor page and ViewModel. If I click on BlazoredTypeahead control, my list is displayed and filtered based on user input. This works great.

<BlazoredTypeahead SearchMethod="@ViewModel.SearchPeople"
                   @bind-Value="@ViewModel.EngineeringTeamLeader"
                   EnableDropDown="false"
                   MinimumLength="3" 
                   ShowDropDownOnFocus="true">
    <SelectedTemplate Context="person">
        @person.DisplayName
    </SelectedTemplate>
    <HelpTemplate>
        Please enter at least 3 characters to perform a search.
    </HelpTemplate>
    <ResultTemplate Context="person">
        @person.DisplayFullName
    </ResultTemplate>
</BlazoredTypeahead>

in my ViewModel...

public Person EngineeringTeamLeader
{
    get => _engineeringTeamLeader;
    set
    {
        if (value == _engineeringTeamLeader)
        {
            return;
        }
        _engineeringTeamLeader = value;

        if (value != null)
        {
            _concession.EngineeringTeamLeader = value.DisplayName;
        }
        OnPropertyChanged();
    }
}

When I load the page with an existing record, I set the EngineeringTeamLeader object, however this name does not appear in the BlazoredTypeahead control. If I give the control focus and navigate away from it, the EngineeringTeamLeader name will appear. So, its appears the control knows about it, but does not initially render it.

Windows OS: Win10 20H2
Visual Studio Pro Version 16.10.0 Preview 1.0
Blazor Server-side app using .Net 5.0

Any suggestions?

Thanks,

Ron

[pkuo]

Can you try downgrading to version 4.5.0?

I'm having the issue similar to yours.

For me, changing the value programmatically doesn't not trigger the control to update. Giving the control focus, navigating away and the value appears.

Downgrading the version 4.5.0. resolves my issue.

[chrissainty]

@RonGramann @pkuo Would it be possible to create a minimal repro of the issue. Once this is done I'll take a look and see if I can spot where the issue is. Thanks

[pkuo]

For the sample added a button to change the selected item.
<button class="btn btn-danger" type="button" style="margin-top: 20px" @onclick="@(_ => FormModel.SelectedPerson = People.First() )">First</button>

Version 4.6.0:

Version 4.5.0:

[mjharwood]

Downgrading the version 4.5.0. resolves my issue.

I've hit the same issue, and downgrading from 4.6.0 to 4.5.1 (and 4.5.0) resolved the problem.

[jsummerlin]

I hit the same issue and downgrading to 4.5.0 fixed it.

[owaits]

This is an issue for me too, rolling back to 4.5.1 has temporarily resolved it for me too. It appears not to be detecting that an initial value has been set. Here is my code if it helps resolve the issue.

@inherits InputBase<string>
@using Blazored.Typeahead

<BlazoredTypeahead class="form-control" SearchMethod="SearchCountries" @bind-Value="SelectedCountry">
    <SelectedTemplate>
        <img src="@context.Flag" height="24px" class="mr-2" />@(context.Name)&nbsp;<span class="text-muted">(@context.Capital)</span>
    </SelectedTemplate>
    <ResultTemplate>
        <img src="@context.Flag" height="24px" class="mr-2" />@(context.Name)&nbsp;<span class="text-muted">(@context.Capital)</span>
    </ResultTemplate>
</BlazoredTypeahead>

 public partial class CountryInput: InputBase<string>
    {
        [Inject]
        public HttpClient Http { get; set; }

        private CountryDetails selectedCountry = null;

        public CountryDetails SelectedCountry
        {
            get { return selectedCountry; }
            set
            {
                if(selectedCountry != value)
                {
                    selectedCountry = value;
                    CurrentValue = value.Name;
                }
            }
        }

        protected async override Task OnInitializedAsync()
        {
            SelectedCountry = string.IsNullOrEmpty(CurrentValue) ? null : (await Http.GetFromJsonAsync<IEnumerable<CountryDetails>>($"https://restcountries.eu/rest/v2/name/{CurrentValue}?fullText=true")).FirstOrDefault();
            StateHasChanged();
        }

        protected override bool TryParseValueFromString(string? value, out string result, [NotNullWhen(false)] out string? validationErrorMessage)
        {
            result =value;
            validationErrorMessage = null;
            return true;
        }

        private async Task<IEnumerable<CountryDetails>> SearchCountries(string searchText)
        {
            return await Http.GetFromJsonAsync<IEnumerable<CountryDetails>>($"https://restcountries.eu/rest/v2/name/{searchText}");
        }
    }

    public class CountryDetails
    {
        public string Name { get; set; }

        public string Capital { get; set; }

        public string Alpha2Code { get; set; }

        public string Alpha3Code { get; set; }

        public string Flag { get; set; }
    }

[m4m4m4]

Any status update on this? Issue is more than 1 year old now

[benshemmeld]

@m4m4m4 @chrissainty I have fixed this issue on this PR #278