Not able to fire events from WPF Combo box items after once item is selected?

Question

There is a scenario i am trying to accomplish for quiet sometime, could not find the way to do with Combo Box. I have Combo box which has a Datatemplate containing a button and textblock. The button is bind to some event so when user clicks on it inside the combo box it fires an event. It works well until i make a selection once i selected the combo box item and than try to click button nothing happens. While doing selection button fires events, once i selecteditem from comb box where button is part of the individual item. Now when i try to click on button which is now a selecteditem of comb box it does not fire any event. Nothing happens.

I want the button to be clickable and fire event even when combo box item is in selected mode. how can i do that? i hope my question is clear

Code As followed --

 <ComboBox x:Name="cbbox" Height="50" Width="200" ItemsSource="{Binding}">
        <ComboBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                   <Button Width="40" Height="30" Content="Clik" Click="Button_Click"></Button>
                    <TextBlock Text="{Binding val}"/>
                </StackPanel>
            </DataTemplate>
        </ComboBox.ItemTemplate>
    </ComboBox>

thanks

vj

Can you update the question and put your XAML definition of `ComboBox` with your `DataTemplate`? — dkozl, Jun 06 '13 at 08:00
Hi i have added the xaml definition , i hope that helps to understand. I hope my question is clear if not let me know i will try to be more specific — Vjendra Gaorh, Jun 06 '13 at 08:16
I want the Button's click event to fire even after the selection of combo box item is made from the drop down. — Vjendra Gaorh, Jun 06 '13 at 08:24

score 0 · Answer 1 · answered Jun 06 '13 at 19:11

The only way to do this is define a new ControlTemplate for the ComboBox. I have created a Style below that will give you the functionality you require.

  <Style x:Key="ComboBoxStyle" TargetType="{x:Type ComboBox}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ComboBox}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition MaxWidth="18"/>
                        </Grid.ColumnDefinitions>
                        <TextBox Name="PART_EditableTextBox"
                                 Padding="5,0,0,0"
                                 Background="Azure"
                                 Height="{TemplateBinding Height}"
                                 IsEnabled="{TemplateBinding IsEditable}"/>
                        <ToggleButton Grid.Column="1" Margin="0"
                                     Height="{TemplateBinding Height}"
                                     Focusable="False"
                                     IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
                                     ClickMode="Press">
                            <Path Grid.Column="1"
                                  HorizontalAlignment="Center"
                                  VerticalAlignment="Center"
                                  Data="M 0 0 L 4 4 L 8 0 Z"
                                  Fill="DodgerBlue" />
                        </ToggleButton>
                        <ContentPresenter Name="ContentSite"
                                          Content="{TemplateBinding SelectionBoxItem}"
                                          ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                                          ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                                          VerticalAlignment="Center"
                                          HorizontalAlignment="Left"
                                          Visibility="Visible"
                                          Margin="5,0,0,0"/>
                        <Popup Name="Popup"
                               Placement="Bottom"
                               IsOpen="{TemplateBinding IsDropDownOpen}"
                               AllowsTransparency="True" 
                               Focusable="False"
                               PopupAnimation="Slide">
                            <Grid 
                                  Name="DropDown"
                                  SnapsToDevicePixels="True"                
                                  MinWidth="{TemplateBinding ActualWidth}"
                                  MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                <Border 
                                    x:Name="DropDownBorder"
                                    Background="Azure"
                                    BorderThickness="1"
                                    BorderBrush="Azure"/>
                                <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
                                    <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
                                </ScrollViewer>
                            </Grid>
                        </Popup>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="HasItems" Value="false">
                            <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="Gray"/>
                        </Trigger>
                        <Trigger Property="IsGrouping" Value="true">
                            <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
                        </Trigger>
                        <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true">
                            <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4"/>
                            <Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/>
                        </Trigger>
                        <Trigger Property="IsEditable" Value="true">
                            <Setter Property="IsTabStop" Value="false"/>
                            <Setter TargetName="PART_EditableTextBox" Property="Visibility" Value="Visible"/>
                            <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

You will need to modify the colors, margins etc. to suit your needs, but it should give you a good starting point.

thanks for replying my post, But it does not work. i have tried using the same template but it did not work. — Vjendra Gaorh, Jun 07 '13 at 08:43
Could you post your updated xaml for the ComboBox and I will take a look? — Richard E, Jun 07 '13 at 09:44
i got the solution i just needed to set the IsHitTestVisible="True" of the ContentPresenter in the combo box controltemplate to TRUE and it worked, by default IsHitTestVisible="False" is set to false so it ignores any input events so once you make it true it allows the event to fire. — Vjendra Gaorh, Jun 10 '13 at 07:11

Not able to fire events from WPF Combo box items after once item is selected?

1 Answers1