SelectedItem not working with Custom Class

[goodbar]

I am having an issue where I receive an "Value not within range of expected..." error upon loading my List.  My setup is that I have a list box with a data template.  Inside the data template is a RadListPicker.  The RadListPicker works great if I just bind to a simple list of strings, but when I try to bind to a custom class, I am not able to set the SelectedItem.

Here is an example of what actually works where CalendarColorOptions is a List<string> and CalendarColor is a String

<telerikInput:RadListPicker ItemsSource="{Binding CalendarColorOptions}" SelectedValue="{Binding CalendarColor, Mode=TwoWay}">

<telerikInput:RadListPicker.ItemTemplate>

<DataTemplate>

<StackPanel>

<TextBlock Text="{Binding}" />

</StackPanel>

</DataTemplate>

</telerikInput:RadListPicker.ItemTemplate>

<telerikInput:RadListPicker.PopupItemTemplate>

<DataTemplate>

<StackPanel

<TextBlock Text="{Binding}" />

</StackPanel>

</DataTemplate>

</telerikInput:RadListPicker.PopupItemTemplate>

</telerikInput:RadListPicker>

AND HERE'S AN EXAMPLE of what generates the error where CalendarColor is a custom class made of 2 properties (Color and ColorName).  CalendarColorOptions is a predefined List of CalendarColors.  When I bind the below I always receive the Value not within the expected range error, as if it does not know that CalendarColor exists in CalendarColorOptions.

<telerikInput:RadListPicker ItemsSource="{Binding CalendarColorOptions}" SelectedValue="{Binding CalendarColor, Mode=TwoWay}">    

<telerikInput:RadListPicker.ItemTemplate>

<DataTemplate>

<StackPanel Orientation="Horizontal">

<Border Background="{Binding Color, Converter={StaticResource ColorToSolidColorBrush}}" Height="30" Width="30" />

<TextBlock MinWidth="10" />

<TextBlock Text="{Binding ColorName}" />

</StackPanel>

</DataTemplate>

</telerikInput:RadListPicker.ItemTemplate>

<telerikInput:RadListPicker.PopupItemTemplate>

<DataTemplate>

<StackPanel Orientation="Horizontal">

<Border Background="{Binding Color, Converter={StaticResource ColorToSolidColorBrush}}" Height="30" Width="30" />

<TextBlock MinWidth="10" />

<TextBlock Text="{Binding ColorName}" />

</StackPanel>

</DataTemplate>

</telerikInput:RadListPicker.PopupItemTemplate>

</telerikInput:RadListPicker>

[Deyan]

Hello Joe,

Thanks for writing.

When using the SelectedValue property you will also need to instruct the RadListPicker control which property on your business object will be used in that context. For that purpose you should use the SelectedValuePath property and set the name of the property on your view model you would like to use as selected value.

Regards,
Deyan
Telerik