How to capture event when WPF combobox element clicked or selected with Enter key?

Question

I tried this for several hours, but it does not work.

I have a combobox with several elements that are generated dynamically, like a search box.

Now I want to capture an event when the user clicks on the drop-down menu or clicks on the drop-down menu.

How to achieve this? I tried installing the mouse / keyboard event handler in Combobox, but it only works in the combobox text box, not in the drop-down list.

Thanks.

Edit: I forgot to mention that I have a custom DataTemplate on my Combobox. I tried a different approach that set the event in ComboBox.ItemContainerStyle.

I tried PreviewKeyDown, but it was not captured. Any idea?

Answer 1

instead of using the MouseLeftButtonDown event, use the PreviewMouseLeftButtonDown event

WPF supports the concept of a "bubble event" when, when the event fires, it squeezes the top element of the tree that implements this event. but ComboBox itself already implements the click event. so you have to say it bubble down.

Answer 2

I think you are looking for the "SelectionChanged" event. This event will be raised as soon as you select an item from the drop-down list, either with a mouse click or with the arrow keys, and press "Enter" (I tried both with success).

  <ComboBox x:Name="cbobox" ItemsSource="{Binding SourceList}" SelectionChanged="cbobox_SelectionChanged"> <ComboBox.ItemContainerStyle> <Style TargetType="{x:Type ComboBoxItem}"> <Setter Property="Template" > <Setter.Value> <ControlTemplate> <TextBlock Text="{Binding BusinessProperty}"/> </ControlTemplate> </Setter.Value> </Setter> </Style> </ComboBox.ItemContainerStyle> </ComboBox> 

Answer 3

I also tried this for several hours, and here is my solution: Sign up for a KeyUp event.

Somehow this is the only event that fires and can be used to highlight between mouse and keyboard selections using custom templates.

 public override void OnApplyTemplate() { base.OnApplyTemplate(); KeyUp += OnKeyUp; } void OnKeyUp(object sender, KeyEventArgs e) { if (e.Key == Key.Down) {...} else if (e.Key == Key.Up) {...} else if(e.Key == Key.Enter) {...} } 

Hope this works for you too.

Answer 4

If you use your own ControlTemplate for your ComboBoxItem, this could be a problem with the HorizontalContentAlignment ContentPresenter. This is what my old ControlTemplate looked like when I had a problem:

 <ControlTemplate TargetType="{x:Type ComboBoxItem}"> .... <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 

And this is how it looked after how I fixed the problem:

 <ControlTemplate TargetType="{x:Type ComboBoxItem}"> .... <ContentPresenter HorizontalAlignment="Stretch" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 

Alternatively, you can leave the ControlTemplate yourself and set the HorizontalContentAlignment for each ComboBoxItem. However, I felt that people should not do this in order to get ComboBoxItem ControlTemplate to work.

Answer 5

In a week, I end this

  <StackPanel> <ComboBox Name="cmb" ItemsSource="{Binding Items}" SelectedValue="{Binding SelectedVale}"> <ComboBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <Button Content="{Binding DisplayText}" Command="{Binding ItemClick}" Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}"></Button> </StackPanel> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox> </StackPanel>