How to capture the event when WPF combobox item is click, or selected by Enter key?

Question

I had tried this for few hours, but it's not working.

I have a combobox, with a few items in there, generated dynamically like a search box.

Now I want to capture an event, when user click on the dropdown menu item, or click on the dropdown menu item.

How to achieve this? I tried to set mouse/keyboard event handler on Combobox, but it only works on the combobox's textbox, not in the dropdown list.

Thanks.

Edit: I forgot to mention that I has custom DataTemplate on my Combobox. I tried another approach which set the event in ComboBox.ItemContainerStyle.

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

score 10 · Answer 1 · edited Jun 14 '16 at 21:48

10

instead of using the MouseLeftButtonDown event, use the PreviewMouseLeftButtonDown event

WPF supports the "event bubbling" concept, that when an event is fired, it bubbles up the an higher element on the tree that implements that event. but the ComboBox itself already implements the click event. so you have to tell it to bubble "down".

edited Jun 14 '16 at 21:48

user3114639

1,895
16
42

answered Apr 14 '11 at 04:38

Notter

588
4
16

Thanks, I forgot to mention that I has custom DataTemplate on my Combobox. I tried another approach which set the event in ComboBox.ItemContainerStyle. I tried PreviewKeyDown, but it is not captured. Any idea? – VHanded Apr 14 '11 at 07:03
[Here is a very helpful MSDN blog post](https://social.msdn.microsoft.com/Forums/sqlserver/en-US/23614f97-5d18-4ab8-97d1-e4b33b2faf48/mouse-left-click-binding-with-combobox?forum=wpf) which actually gives code for how to implement this answer. – Tim Biegeleisen Jul 31 '18 at 09:38
1

This wont work when choosing element with keyboard – Chandraprakash Nov 11 '21 at 09:24

score 5 · Answer 2 · answered Apr 14 '11 at 07:22

I think that what you are looking for is the "SelectionChanged" event. This event is raised as soon as you select an item in the drop down, either by mouse click or by navigating with arrow keys and hit "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>

I know selectionchanged will fire if I move up or down with my mouse or keyboard up/down key, but when I press 'Enter', I need another event to fire. I have a solution to use selectionChanged to copy the current selected ComboBoxItem to a global ComboBoxItem, then use combobox_PreviewKeyUp to capture Enter key, and process the globalComboBox item. Not elegant, but is my current solution, it's working — VHanded, Apr 14 '11 at 08:08

score 2 · Answer 3 · answered Aug 17 '11 at 05:48

I also tried this for hours and here is my solution: Subscribe to the KeyUp event.

Somehow this is the only event being fired and that can be used to distinct between mouse and keyboard selection 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 as well.

score 0 · Answer 4 · answered Mar 06 '17 at 17:42

After a week i end up with 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>

score 0 · Answer 5 · answered May 30 '20 at 15:42

0

Try setting an event of type DropDownClosed and capture that.

I tested it in my program and it seems to be called just before closing combobox dropdown.

I refer you to this question for further information on this.

answered May 30 '20 at 15:42

Amir Maleki

313
1
11

Will not work if you use keyboard to choose the change the item – Chandraprakash Nov 11 '21 at 09:27
@Chandraprakash This is not what question asked, it was about selecting it with `Enter` key. But I hear you, when you use navigation keys it does not update itself automatically. For handling that issue you need to handle `SelectionChanged` event as well. Please check the first answer in the linked question. – Amir Maleki Nov 19 '21 at 11:43
Why this is important is, In the application any shortcut user will be using the keyboard to navigate in form, so this will be a bug if you implement dropdownclosed event alone and forego keyboard scenario – Chandraprakash Nov 20 '21 at 01:39

score 0 · Answer 6 · answered Jul 12 '11 at 21:46

If you are using a custom ControlTemplate for your ComboBoxItem, it might be a problem with the HorizontalContentAlignment of the ContentPresenter. Here is how my old ControlTemplate looked, when I was having the problem:

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

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

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

Alternatively, you could leave the ControlTemplate alone and set the HorizontalContentAlignment for each ComboBoxItem. However, I felt like people shouldn't have to do that to make my ComboBoxItem ControlTemplate work.

score 0 · Answer 7 · answered Nov 20 '21 at 01:41

0

For ComboBox in WPF, Use the GotFocus Event

GotFocus Event will fire if you use mouse or keyboard to access the combobox

answered Nov 20 '21 at 01:41

Chandraprakash

773
1
10
18

How to capture the event when WPF combobox item is click, or selected by Enter key?

7 Answers7