This is a migrated thread and some comments may be shown as answers.

SelectedItems

11 Answers 1708 Views

ComboBox

This is a migrated thread and some comments may be shown as answers.

Carlo asked on 29 Mar 2017, 08:15 AM

Hello,
There is a way to Binding SelectedItems of a telerik:RadComboBox with AllowMultipleSelection="True" that works in a runtime?
Our purpose is to create a multiple combobox with checkboxes (bindable from a property)

At the movement I have this code, but it doesn’t works correctly because SelectedItems don’t exist

        public class Agency(){
            public string Text { get; set; }
            public bool IsChecked { get; set; }
        }

        private ObservableCollection<Agency> Agencies;
        public ObservableCollection<Agency> Agencies
        {
            get
            {
                return this.selectedAgencies;
            }
            set
            {
                if (this.selectedAgencies != value)
                {
                    this.selectedAgencies = value;
                    this.OnPropertyChanged(() =>this.SelectedAgencies);
                }
            }
        }

        private ObservableCollection<Agency> selectedAgencies;
        public ObservableCollection<Agency> SelectedAgencies
        {
            get
            {
                return this.selectedAgencies;
            }
            set
            {
                if (this.selectedAgencies != value)
                {
                    this.selectedAgencies = value;
                    this.OnPropertyChanged(() =>this.SelectedAgencies);
                }
            }
        }

        <telerik:RadComboBox x:Name="radComboBox"
                             ItemsSource="{Binding Agency}"
                             AllowMultipleSelection="True"
                             SelectedItems="{BindingSelectedAgencies}">
            <telerik:RadComboBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <CheckBox VerticalAlignment="Center"IsChecked="{Binding IsChecked}"></CheckBox>
                        <TextBlock Margin="5" Text="{Binding Text}"/>
                    </StackPanel>
                </DataTemplate>
            </telerik:RadComboBox.ItemTemplate>
        </telerik:RadComboBox>

11 Answers, 1 is accepted

answered on 29 Mar 2017, 02:37 PM

Hello Carlo,

SelectedItems property of RadComboBox is read-only as it is inherited directly from the MultiSelector class, that's why it cannot be bound to a property in the ViewModel.

One possible approach you could use is to extend the functionality of RadComboBox by using an attached property and add the desired items to the SelectedItems collection of the ComboBox.
I'd suggest you take a look at the followng blog post for more detailed instructions:
Extending the functionality of RadControls with Attached Properties

Additionally, you could check the example with RadComboBox in the following thread:
Multiselect Binding SelectedItems

I hope this will be helpful.

Regards,
Yana
Telerik by Progress

Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.

answered on 25 Apr 2017, 12:03 PM

image001.png

Hello Yana,

thank you for your reply. Your solution worked well, but doesn't work if i put my RadCombox inside the RadDataForm.NewItemTemplate. There some kind of problems with template?

The problem is that the ComboBox properties inside the class "SelectedItemsBehavior" result equal to null (see the attached image).

Please can you help me?

Thank You.

<telerik:RadComboBox

SelectedValuePath="CID"

Name="rcbGroupMembers"

Width="200"

Height="25"

HorizontalAlignment="Left"

EmptyText="- Members -"

AllowMultipleSelection="True"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.GroupMembers}"

ItemTemplate="{StaticResource CheckBoxItemTemplate}"

MultipleSelectionBoxTemplate="{StaticResource MultipleSelectionBoxTemplate}">

<i:Interaction.Behaviors>

<behavior:SelectedItemsBehavior SelectedItems="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers}" />

</i:Interaction.Behaviors>

</telerik:RadComboBox>

<telerik:RadListBox

SelectedValuePath="CID"

DisplayMemberPath="FULLNAME"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers, Mode=TwoWay}">

</telerik:RadListBox>

<telerik:RadComboBox

SelectedValuePath="CID"

Name="rcbGroupMembers"

Width="200"

Height="25"

HorizontalAlignment="Left"

EmptyText="- Members -"

AllowMultipleSelection="True"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.GroupMembers}"

ItemTemplate="{StaticResource CheckBoxItemTemplate}"

MultipleSelectionBoxTemplate="{StaticResource MultipleSelectionBoxTemplate}">

<i:Interaction.Behaviors>

<behavior:SelectedItemsBehavior SelectedItems="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers}" />

</i:Interaction.Behaviors>

</telerik:RadComboBox>

<telerik:RadListBox

SelectedValuePath="CID"

DisplayMemberPath="FULLNAME"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers, Mode=TwoWay}">

</telerik:RadListBox>

<telerik:RadComboBox

SelectedValuePath="CID"

Name="rcbGroupMembers"

Width="200"

Height="25"

HorizontalAlignment="Left"

EmptyText="- Members -"

AllowMultipleSelection="True"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.GroupMembers}"

ItemTemplate="{StaticResource CheckBoxItemTemplate}"

MultipleSelectionBoxTemplate="{StaticResource MultipleSelectionBoxTemplate}">

<i:Interaction.Behaviors>

<behavior:SelectedItemsBehavior SelectedItems="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers}" />

</i:Interaction.Behaviors>

</telerik:RadComboBox>

<telerik:RadListBox

SelectedValuePath="CID"

DisplayMemberPath="FULLNAME"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers, Mode=TwoWay}">

</telerik:RadListBox>

<telerik:RadComboBox

SelectedValuePath="CID"

Name="rcbGroupMembers"

Width="200"

Height="25"

HorizontalAlignment="Left"

EmptyText="- Members -"

AllowMultipleSelection="True"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.GroupMembers}"

ItemTemplate="{StaticResource CheckBoxItemTemplate}"

MultipleSelectionBoxTemplate="{StaticResource MultipleSelectionBoxTemplate}">

<i:Interaction.Behaviors>

<behavior:SelectedItemsBehavior SelectedItems="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers}" />

</i:Interaction.Behaviors>

</telerik:RadComboBox>

<telerik:RadListBox

SelectedValuePath="CID"

DisplayMemberPath="FULLNAME"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers, Mode=TwoWay}">

</telerik:RadListBox>

<telerik:RadComboBox

SelectedValuePath="CID"

Name="rcbGroupMembers"

Width="200"

Height="25"

HorizontalAlignment="Left"

EmptyText="- Members -"

AllowMultipleSelection="True"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.GroupMembers}"

ItemTemplate="{StaticResource CheckBoxItemTemplate}"

MultipleSelectionBoxTemplate="{StaticResource MultipleSelectionBoxTemplate}">

<i:Interaction.Behaviors>

<behavior:SelectedItemsBehavior SelectedItems="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers}" />

</i:Interaction.Behaviors>

</telerik:RadComboBox>

<telerik:RadListBox

SelectedValuePath="CID"

DisplayMemberPath="FULLNAME"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers, Mode=TwoWay}">

</telerik:RadListBox>

<telerik:RadComboBox

SelectedValuePath="CID"

Name="rcbGroupMembers"

Width="200"

Height="25"

HorizontalAlignment="Left"

EmptyText="- Members -"

AllowMultipleSelection="True"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.GroupMembers}"

ItemTemplate="{StaticResource CheckBoxItemTemplate}"

MultipleSelectionBoxTemplate="{StaticResource MultipleSelectionBoxTemplate}">

<i:Interaction.Behaviors>

<behavior:SelectedItemsBehavior SelectedItems="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers}" />

</i:Interaction.Behaviors>

</telerik:RadComboBox>

<telerik:RadListBox

SelectedValuePath="CID"

DisplayMemberPath="FULLNAME"

ItemsSource="{Binding ElementName=rdfGroup, Path=DataContext.SelectedGroupMembers, Mode=TwoWay}">

</telerik:RadListBox>

answered on 28 Apr 2017, 10:26 AM

RadComboBoxWPF.zip

Hello Carlo,

We are not aware of any issues regarding the NewItemTemplate of RadDataForm that can be related to the usage of RadComboBox within it. I modified the example from the referred forum thread that shows how the control can be used within the scope of RadDataForm. You should be able to observe, that its multiselection is not affected in any manner. Can you please check it out?

Regards,
Stefan X1
Telerik by Progress

answered on 10 May 2017, 04:46 PM

Hi Carlo,

I tried binding the RadComboBox defined within the NewItemTemplate of RadDataForm to the SelectedAgencies property in the view model and again, I was not able to replicate the reported NullReferenceException. Can you please verify that you are not observing any binding errors when debugging the application? Also, in order to avoid any misunderstandings regarding the setup you are using, may I kindly ask you to modify the application attached to my previous post so that the error is reproduced, open a new support thread and attach the demo project in it? We will be glad to assist you further.

Thanks in advance for your cooperation.

All the best,
Stefan X1
Telerik by Progress

answered on 11 May 2017, 07:10 AM

screenshot_20170511-090423.jpg

Hello Stefan, thank you for tour reply. In your solution there is a binding error on selected items. Please modify the binding as i made in my picture and you will get the error opening the form in the "add mode"

answered on 17 May 2017, 02:11 PM

Hi Carlo,

Firstly, thank you for your patience.

I researched the case and it seems that the NullReferenceException is raised as the element on which the attached behavior is applied cannot be resolved when the control is placed within a DataTemplate. Strangely enough, this is reproduced only when the behavior is applied through the Interaction.Behaviors. Moreover, it is not related to the usage of the RadDataForm control. You can reproduce it with a standard ListBox by placing the RadComboBox control within its ItemTemplate, for example.

So, what I can suggest you is to avoid the usage of the Interactivity provided by the framework and simply apply the attached behavior to the RadComboBox control. Note, that with such an approach, the attached behavior needs to be rewritten as well.

I hope that this clarifies your concerns.

Best Regards,
Stefan X1
Telerik by Progress