Element Binding using RadContextMenu not working?

[Rob]

Hello,

I am trying to simulate radio button behavior in a RadMenu.  I thought it would be possible to simply have some hidden RadioButtons on my page and ElementBind the "IsChecked" property of the RadMenuItem to the RadioButton.

And actually, it works!

And then I tried to switch to a RadContextMenu and it stops working.  I am assuming that it has something to do with the DataContext possibly but am not sure.  I tried setting the "InheritDataContext" property and it did not seem to help.

I've attached a code sample below...

<Grid x:Name="LayoutRoot" Background="White">

   <StackPanel Orientation="Horizontal">

      <StackPanel Orientation="Vertical">
        <RadioButton x:Name="opt1" Content="Option1" IsChecked="True" GroupName="grp1" />
        <RadioButton x:Name="opt2" Content="Option2" IsChecked="False" GroupName="grp1" />
      </StackPanel>

      <ToggleButton Width="40" Height="40" Content="^" IsChecked="{Binding IsOpen, ElementName=rcm, Mode=TwoWay}">
         <RadNav:RadContextMenu.ContextMenu>
            <RadNav:RadContextMenu x:Name="rcm" Placement="Bottom" InheritDataContext="True">
               <RadNav:RadMenuItem Header="Option1" IsCheckable="True" IsChecked="{Binding IsChecked, ElementName=opt1, Mode=TwoWay}"/>
               <RadNav:RadMenuItem Header="Option2" IsCheckable="True" IsChecked="{Binding IsChecked, ElementName=opt2, Mode=TwoWay}"/>
            </RadNav:RadContextMenu>
         </RadNav:RadContextMenu.ContextMenu>
      </ToggleButton>

      <RadNav:RadMenu>
         <RadNav:RadMenuItem Header="^">
            <RadNav:RadMenuItem Header="Option1" IsCheckable="True" IsChecked="{Binding IsChecked, ElementName=opt1, Mode=TwoWay}"/>
            <RadNav:RadMenuItem Header="Option2" IsCheckable="True"
IsChecked="{Binding IsChecked, ElementName=opt2, Mode=TwoWay}"/>
         </RadNav:RadMenuItem>
      </RadNav:RadMenu>

   </StackPanel>


</Grid>

[Valeri Hristov]

Hi Rob,

I suppose this behavior is a limitation of the Silverlight XAML parser. Actually, the same can be observed if you use the standard ContextMenu control in WPF.

We will do our best to provide built-in radio button functionality in RadMenu/RadContextMenu for Q3 2010 (November), but meanwhile I would recommend using a ViewModel as in our online examples:
http://demos.telerik.com/silverlight/#Menu/CheckableMenuItems

I managed to create a little hack, however, that seems to work, but I don't know of any side effects:

<ToggleButton IsChecked="{Binding IsOpen, ElementName=rcm, Mode=TwoWay}" Width="40" Height="40">
 <telerik:RadContextMenu.ContextMenu>
 <telerik:RadContextMenu x:Name="rcm" Placement="Bottom" InheritDataContext="True">
 <telerik:RadMenuItem Header="Option1" IsCheckable="True"
 IsChecked="{Binding Menu.UIElement.Content.Children[1].Children[0].IsChecked, Mode=TwoWay, RelativeSource={RelativeSource Self}}" />
 <telerik:RadMenuItem Header="Option2" IsCheckable="True"
 IsChecked="{Binding Menu.UIElement.Content.Children[1].Children[1].IsChecked, Mode=TwoWay, RelativeSource={RelativeSource Self}}" />
 </telerik:RadContextMenu>
 </telerik:RadContextMenu.ContextMenu>
 
 <ToggleButton.Content>
 <StackPanel>
 <TextBlock Text="^" />
 <StackPanel Orientation="Vertical" Visibility="Collapsed">
 <RadioButton x:Name="opt1" Content="Option1" IsChecked="True" GroupName="grp1" />
 <RadioButton x:Name="opt2" Content="Option2" IsChecked="False" GroupName="grp1" />
 </StackPanel>
 </StackPanel>
 </ToggleButton.Content>
 </ToggleButton>

Sincerely yours,
Valeri Hristov
the Telerik team