How to hide items of a combobox in WPF

Question

Is there a way to hide items of a combobox in WPF? In my usercontrol there is a ListBox with checkbox-items bound to an ObservableCollection and a datagrid with a combobox.

<ListBox x:Name="AvailableAttributes" Grid.Row="0" Grid.Column="2" SelectionMode="Single" >
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=OneWay}"/>
        </Style>
    </ListBox.ItemContainerStyle>

    <ListBox.ItemTemplate>
        <DataTemplate>
            <CheckBox Content="{Binding Name}" IsChecked="{Binding IsSelected}"/>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

... 

<DataGrid Name="datagrid" AutoGenerateColumns="False" >
    <DataGrid.Columns>
        <DataGridTextColumn Binding="{Binding Name}" />
            <DataGridComboBoxColumn 
                SelectedValueBinding="{Binding CBID}" 
                DisplayMemberPath="Name" 
                SelectedValuePath="ID">

                <DataGridComboBoxColumn.ElementStyle>
                    <Style TargetType="{x:Type ComboBox}">
                        <Setter Property="ItemsSource" 
                            Value="{Binding Path=CBItems, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" />
                    </Style>
                </DataGridComboBoxColumn.ElementStyle>
                <DataGridComboBoxColumn.EditingElementStyle>
                    <Style TargetType="{x:Type ComboBox}">
                        <Setter Property="ItemsSource" 
                            Value="{Binding Path=CBItems, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" />
                    </Style>
                </DataGridComboBoxColumn.EditingElementStyle>
            </DataGridComboBoxColumn>
        </DataGrid.Columns>
    </DataGrid>

I used this solution to manage the combobox items and added the property 'IsSelected'

public class GridItem
{
    public string Name { get; set; }
    public int CBID { get; set; }
}

public class CBItem
{
    public int ID { get; set; }
    public string Name { get; set; }
    public bool IsSelected { get; set; }
}

Now I want to use the 'IsSelected' property to hide/show the item in the combobox. Can someone tell me how can I achieve this?

Answer 1

Pretty simple: Just give the combobox items a style with a trigger that sets ComboBoxItem.Visibility according to the value of IsSelected on the ComboBoxItem's DataContext:

<Style TargetType="{x:Type ComboBox}" BasedOn="{StaticResource {x:Type ComboBox}}">
    <Setter Property="ItemsSource" 
        Value="{Binding Path=CBItems, RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" />
    <Setter Property="ItemContainerStyle">
        <Setter.Value>
            <Style TargetType="ComboBoxItem" BasedOn="{StaticResource {x:Type ComboBoxItem}}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IsSelected}" Value="False">
                        <Setter Property="Visibility" Value="Collapsed" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Setter.Value>
    </Setter>
</Style>

If you might ever be updating the value of IsSelected on any of these items after the ComboBoxes are loaded in the grid, you will need to implement INotifyPropertyChanged on CBItem so that the UI will reflect the change.

Answer 2

If you wanna show a specific property and filter out items according to another property value you should use ItemTemplate and ItemContainerStyle together. In this example ItemSource has set to an ObservableCollection type property which is part of another Combobox ItemSource

  <ComboBox x:Name="combo2" ItemsSource="{Binding SelectedItem.Devices,ElementName=combo1}">
     <ComboBox.ItemTemplate>
        <DataTemplate>
           <TextBlock Text="{Binding Name}"></TextBlock>
        </DataTemplate>
      </ComboBox.ItemTemplate>
      <ComboBox.ItemContainerStyle>
         <Style TargetType="ComboBoxItem">
            <Style.Triggers>
               <DataTrigger Binding="{Binding DeviceId}" Value="125">
                  <Setter Property="Visibility" Value="Collapsed"></Setter>
               </DataTrigger>
            </Style.Triggers>
         </Style>
      </ComboBox.ItemContainerStyle>
 </ComboBox>