Silverlight Multiselect Listbox

The Listbox control of Silverlight 2 have no multi selection. Datagrid have! I want to show how to build a Listbox with Checkboxes and iterate at the end through all items an see if they are checked. Seams to be easy!?

But isn't.  You can not access the content of the datatemplate. One solution is to use visualtreehelper to iterate through all controls of controltree. That is quite complkicated cause e.g a checkbox is a composition of Textblock and Rectangle.

I show the databinding way which is quite cool

First I have to generate a class where all data is in and a additional field for the checked value.

Imports System.ComponentModel
Imports System.Collections.ObjectModel
Public Class Listboxdaten
    Implements INotifyPropertyChanged
    Private _checked As Boolean
    Public Property checked() As Boolean
        Get
            Return _checked
        End Get
        Set(ByVal value As Boolean)
            _checked = value
            OnPropertyChanged("checked")
        End Set
    End Property

    Private _daten As String
    Public Property daten() As String
        Get
            Return _daten
        End Get
        Set(ByVal value As String)
            _daten = value
            OnPropertyChanged("daten")
        End Set
    End Property
Public Event PropertyChanged(ByVal sender As Object, ByVal e As System.ComponentModel.PropertyChangedEventArgs) Implements System.ComponentModel.INotifyPropertyChanged.PropertyChanged
    Protected Sub OnPropertyChanged(ByVal name As String)
        RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(name))
    End Sub
End Class

I dont like the typing, but that is another story. Now comes the cool part  in XAML. The trick is to do a two way binding.

<ListBox x:Name="lstFields" SelectionChanged="lstFields_SelectionChanged" >
     <ListBox.ItemTemplate>
                <DataTemplate>
              <StackPanel Orientation="Horizontal" x:Name="stack1">
                   <CheckBox x:Name="chkFields" IsChecked="{Binding checked, Mode=TwoWay}"></CheckBox>
                      <TextBlock Text="{Binding daten}"></TextBlock>
                </StackPanel>
         </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>
<Button x:Name="Button1" Width="30" Height="20" Click="Button1_Click"></Button>

A little bit code to fill the data onload

Private Sub page17_Loaded(ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs) Handles Me.Loaded
        lstFields.Items.Add(New Listboxdaten With {.checked = True, .daten = "eins"})
        lstFields.Items.Add(New Listboxdaten With {.checked = True, .daten = "zwei"})
        lstFields.Items.Add(New Listboxdaten With {.checked = True, .daten = "drei"})

A little bit more code to get the items an see if it is checked

Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
        For Each i In lstFields.Items
            If CType(i, Listboxdaten).checked Then
                MessageBox.Show("checked")
            End If
        Next
End Sub

 

Do you like it? Feel free to comment

6 Comments

  • The code above in C# using the telerik-converter:

    using System.ComponentModel;
    using System.Collections.ObjectModel;
    public class Listboxdaten : INotifyPropertyChanged
    {
    private bool _checked;
    public bool @checked {
    get { return _checked; }
    set {
    _checked = value;
    OnPropertyChanged("checked");
    }
    }

    private string _daten;
    public string daten {
    get { return _daten; }
    set {
    _daten = value;
    OnPropertyChanged("daten");
    }
    }
    public event System.ComponentModel.INotifyPropertyChanged.PropertyChanged;
    protected void OnPropertyChanged(string name)
    {
    if (PropertyChanged != null) {
    PropertyChanged(this, new PropertyChangedEventArgs(name));
    }
    }
    }

    //=======================================================
    //Service provided by Telerik (www.telerik.com)
    //Conversion powered by NRefactory.
    //Built and maintained by Todd Anglin and Telerik
    //=======================================================

  • how to change the background colour of selected items in listbox ?

  • great Post. Saved lot of my time. thanks.

  • I'm wanting to create a generic multi-select ListBox, called ListBoxEx for old times sake.

    This example is pointed to from many pages, but it seems incomplete (or it's just my ignorance, which I would like to reduce...).

    Could this control be extended to have a "SelectedItems" property? I would love some direction or help on this.

    (Of course this is moot when Silverlight 3 comes out, but who knows when my client will actually adopt SL 3 - 2013??)

    The ListBox in the XAML has an event: lstFields_SelectionChanged
    What does this event do?

  • Dim i As Integer
    Dim StrFormTypes As String
    StrFormTypes = ""
    If CheckBox1.Checked Then
    For i = 0 To ListBox1.Items.Count - 1
    If StrFormTypes = "" Then
    StrFormTypes = "(FORMTYPE = '" & ListBox1.Items(i).Value & "'"
    If StrFormTypes = "C" Then
    StrFormTypes = "(FORMTYPE = 'UMULTI' OR FORMTYPE='USINGLE'"
    End If
    Else
    StrFormTypes = StrFormTypes & " OR " & "FORMTYPE = '" & ListBox1.Items(i).Value & "'"
    End If
    Next
    Else
    For i = 0 To ListBox1.Items.Count - 1
    If ListBox1.Items(i).Selected = True Then
    If StrFormTypes = "" Then
    StrFormTypes = "(FORMTYPE = '" & ListBox1.Items(i).Value & "'"
    Else
    StrFormTypes = StrFormTypes & " OR " & "FORMTYPE = '" & ListBox1.Items(i).Value & "'"
    End If
    End If
    Next
    End If

  • Hi,

    How can i Select All / Unselect all items in the checked list box when i click the buttons.

Comments have been disabled for this content.