ListBox display multiple selected items

Question

I have here a ListBox which shall show serveral items where some of them are selected.

<ListBox IsEnabled="False" x:Name="SecondaryModelSelector" SelectionMode="Extended"  SelectedItem="{Binding Path=DataContext.SelectedSecondaryModels, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContentControl}, Mode=OneWay}" ItemsSource="{Binding Path=DataContext.AvailableModels, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ContentControl}}" >
 <ListBox.ItemTemplate>
  <DataTemplate>
   <StackPanel Orientation="Horizontal">
    <Label Content="{Binding Name}" Margin="5,0,5,0"/>
   </StackPanel>
  </DataTemplate>
 </ListBox.ItemTemplate>
</ListBox>

The selected items are set in a ComboBox and thus the ListBox is disabled and Mode=OneWay to disable selection in the ListBox itself. The Template looks like this:

<Style x:Key="MyListBoxItem" TargetType="ListBoxItem">
 <Setter Property="SnapsToDevicePixels"  Value="true" />
 <Setter Property="Template">
  <Setter.Value>
   <ControlTemplate TargetType="ListBoxItem">
    <Border x:Name="Border"  Padding="2">
     <ContentPresenter />
    </Border>
    <ControlTemplate.Triggers>
     <Trigger Property="IsSelected" Value="true">
      <Setter TargetName="Border" Property="Background" Value="Blue"/>
     </Trigger>
    </ControlTemplate.Triggers>
   </ControlTemplate>
  </Setter.Value>
 </Setter>
</Style>

<Style x:Key="MyListBoxBorder" TargetType="{x:Type ListBox}">
 <Setter Property="ItemContainerStyle" Value="{StaticResource MyListBoxItem}"/>
 <Setter Property="Template">
   <Setter.Value>
    <ControlTemplate TargetType="ListBox">
     <Border x:Name="OuterBorder">
      <ScrollViewer Margin="0"  Focusable="false">
       <StackPanel Margin="2" IsItemsHost="True" />
      </ScrollViewer>
    </Border>
   </ControlTemplate>
  </Setter.Value>
 </Setter>
</Style>

The problem is now, that I cannot display multiple selected items, i.e. the background does not turn blue. Showing only one selected item is no problem.

Works (but shows only one selected item...)

public Cpu SelectedSecondaryModels
{
    get  { return SelectedGlobalVariable.SecondaryModels.FirstOrDefault();  }
}

Does not work:

public ObservableCollection<Model> SelectedSecondaryModels
{
    get  { return new ObservableCollection<Model>(SelectedGlobalVariable.SecondaryModels);  }
}

I have no errors, so how can I show multiple selected items? I tried SelectedItems instead of SelectedItem instead, but this is read-only field. When I allow to select items in the ListBox than the blue background appears, and binding throws errors as there is no setter method.

score 1 · Accepted Answer · answered Apr 07 '21 at 17:57

1

The SelectedItem property cannot be bound to a collection of several items to be selected.

And as you have already noticed, SelectedItems is a read-only property.

You could use an attached behaviour to work around this. Please refer to this blog post and this example for more information about how to do this.

You will also find some solutions here:

Bind to SelectedItems from DataGrid or ListBox in MVVM

answered Apr 07 '21 at 17:57

mm8

163,881
10
57
88

I hoped to find a better solution, as these links are already more or less several years old. Highly disappointing that there is no improvement... – Hagi Apr 09 '21 at 09:31

ListBox display multiple selected items

1 Answers1