RadComboBox shows wrong Text when setting in ViewModel

[JF]

Hi,

i have a RadComboBox where the ItemsSource is bound to a list of strings, the Text to a String and where IsEditable is true.

When setting the Text (in viewmodel) to a value, which is not included in the list of strings, it shows the "suggested" text (like when i enter it manually in the box), not the text which was set.This occurs when the viewmodel value is set delayed (not in ctor).

Here is a small sample code.

MainWindow.xaml

<Window x:Class="TelerikCombobox.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:TelerikCombobox"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <StackPanel Margin="3">
            <telerik:RadComboBox Text="{Binding SelectedValue, Mode=TwoWay}" ItemsSource="{Binding SuggestedValues}" IsEditable="True"/>
            <TextBlock Text="{Binding SelectedValue, Mode=OneWay}"/>
        </StackPanel>
    </Grid>
</Window>

 

MainWindow.cs

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        this.DataContext = new ViewModel()
        {
            SuggestedValues = new String[] { "100", "200", "300" },
        };

        SetValueDelayed();
    }

    private async void SetValueDelayed()
    {
        await Task.Delay(2000);
        if (this.DataContext is ViewModel viewModel)
            viewModel.SelectedValue = "3";
    }
}

 

ViewModel.cs

public class ViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        private String m_SelectedValue;
        public String SelectedValue
        {
            get
            {
                return m_SelectedValue;
            }
            set
            {
                m_SelectedValue = value;
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SelectedValue)));
            }
        }

        private IEnumerable<String> m_SuggestedValues;
        public IEnumerable<String> SuggestedValues
        {
            get
            {
                return m_SuggestedValues;
            }
            set
            {
                m_SuggestedValues = value;
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SuggestedValues)));
            }
        }
    }

 

After the value "3" is set, the combobox shows 300.

 

Thanks

 

[Dilyan Traykov]

Hi Jörg,

Thank you very much for the provided code snippets.

With the current implementation of the control, the result you observe is expected and is caused by the IsTextSearchEnabled property of the control which finds the first matching item and sets the Text property to its string representation. You can notice that the same Text is set when you manually type "3" in the TextBox part of the control. The reason why this differs from when you set the value in the constructor is due to the timing of the operations.

One possible approach, in this case, would be to set the IsTextSearchEnabled property to False before setting the SelectedValue property of the viewmodel and bringing it back afterward:

            if (this.DataContext is ViewModel viewModel)
            {
                this.combo.IsTextSearchEnabled = false;
                viewModel.SelectedValue = "3";
                this.combo.IsTextSearchEnabled = true;
            }

Please let me know if such an approach would work for you. If that is not the case, please provide more details on your exact requirement and why you need to use the Text property and I will gladly try to come up with a viable solution for your particular scenario.

Regards,
Dilyan Traykov
Progress Telerik

[JF]

Hi,
thanks for your response.

unfortunately this approach wont fit, because the values (a lot) will get set in the viemodel, which has no access to the view (controls).
I'm sorry that my sinppets were misleading. I will attach some updated.

ViewModel.cs

public class ViewModel : INotifyPropertyChanged
   {
       public event PropertyChangedEventHandler PropertyChanged;

       private String m_SelectedValue;
       public String SelectedValue
       {
           get
           {
               return m_SelectedValue;
           }
           set
           {
               m_SelectedValue = value;
               PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SelectedValue)));
           }
       }

       private IEnumerable<String> m_SuggestedValues;
       public IEnumerable<String> SuggestedValues
       {
           get
           {
               return m_SuggestedValues;
           }
           set
           {
               m_SuggestedValues = value;
               PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SuggestedValues)));
           }
       }

       public async void LoadValueDelayed()
       {
           await Task.Delay(2000);

           SelectedValue = "3";
       }
   }

MainWindow.xaml.cs

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        Loaded += MainWindow_Loaded;
        this.DataContext = new ViewModel()
        {
            SuggestedValues = new String[] { "100", "200", "300" },
        };

    }

    private void MainWindow_Loaded(object sender, RoutedEventArgs e)
    {
        if (DataContext is ViewModel viewModel)
            viewModel.LoadValueDelayed();
    }
}

 

Thanks for your effort

[Dilyan Traykov]

Hi JF,

Thank you for the clarification and updated code snippets.

In such a case, I believe you can set the IsTextSearchEnabled property prior to executing the LoadValueDelayed method, await it, and bring it back afterward:

        private async void MainWindow_Loaded(object sender, RoutedEventArgs e)
        {
            if (DataContext is ViewModel viewModel)
            {
                this.combo.IsTextSearchEnabled = false;
                await viewModel.LoadValueDelayed();
                this.combo.IsTextSearchEnabled = true;
            }
        }

Please note that for the purpose you will also need to change the return type of the method to Task:

        public async Task LoadValueDelayed()
        {
            await Task.Delay(2000);

            SelectedValue = "3";
        }

I've prepared a small sample project based on these code snippets which seems to achieve the desired result. Please have a look and let me know if the same approach would work in your original application.

Regards,
Dilyan Traykov
Progress Telerik