Hey Team,
I have a question want to ask for advice. I'm using a comboBox to do a research functionality。
First I initialed my drop down list with a collection of data. Then I defined SelectionChanged event(convert to command) which updated drop down list options.
When I choice an option, it fired SelectionChanged event. and updated drop down list. after that I saw the selected option didn't show on the TextBox.
I want to know is there a way to show my selected option in Text Box(ComboBox)?
When I debug SelectionChanged event, I found it fired twice.
I attached my example project if you want to take a look.
Thanks
Allen
1 Answer, 1 is accepted
Hi Allen,
Thank you for the provided sample app.
The SelectionChanged event is fired twice because in OnSelectCommand the ItemsSource has been reset.
Resetting the ItemsSource on the other hand affects the SelectedItem and that's the reason why no item is displayed as selected.
My suggestion is to manipulate the ItemsSource collection without resetting it through its API.
Keep in mind that SelectionChanged event provides ComboBoxSelectionChangedEventArgs which contains the added/removed items that can be used to manipulate the ItemsSource collection.
Solution Suggestion:
The EventToCommandBehavior class has a property called EventArgsConverter which can be used to obtain the arguments in your command as a parameter.
1. Your converter should inherit from ICommunityToolkitValueConverter and in the Convert method you can check if the passed arguments are from the correct type before returning them.
public class SelectionChangedEventArgsConverter : ICommunityToolkitValueConverter
{
public Type FromType => throw new NotImplementedException();
public Type ToType => throw new NotImplementedException();
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var selectionChangedEventArgs = value as ComboBoxSelectionChangedEventArgs;
if (selectionChangedEventArgs == null)
{
throw new ArgumentException("Expected value to be of type ComboBoxSelectionChangedEventArgs", nameof(value));
}
return selectionChangedEventArgs;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
return null;
}
}
2. Declare the converter in XAML and pass it as a static resource to the EventArgsConverter property.
<ContentPage.Resources>
<local:SelectionChangedEventArgsConverter x:Key="SelectionChangedEventArgsConverter" />
</ContentPage.Resources>
<toolKit:EventToCommandBehavior Command="{Binding OnSelectCommand}"
EventName="SelectionChanged"
EventArgsConverter="{StaticResource SelectionChangedEventArgsConverter}" />
3. Finally in your view model class, you have to add a parameter of type object to the action that is used by the command, where the arguments will be passed.
[ICommand]
public void OnSelect(object args)
{
//Example 1: Your custom logic for ItemsSource collection manipulation
this.Items.Add(new City { Name = "Test City", Population = 8888888 });
//Example 2: Your custom logic for ItemsSource collection manipulation by using the arguments
var args = arg as ComboBoxSelectionChangedEventArgs;
var addedItems = args.AddedItems.FirstOrDefault();
}Please note that how to use the event to command behavior is a general knowledge. And the toolkit you use is a third party-library and it requires custom implementation development.
I hope the provided information was helpful, let me know if you need further help.
Regards,
Alex
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 1
Iron
Iron