[Solved] RadModalWindow and DataContext

[Stavros Menegos]

Hi there,

I have a RadModalWindow control inside a grid in my phone page. The window is to open in response to a templated listbox's selectedchange event.

It seems that I cannot force the radmodal windows datacontext to the listbox's current item. I am not sure if this has to do with the radmodal window or with a typical silverlight control in general so please forgive my mistake if any.

What should I set to the DataContext of the Actions RadModalWindow in order to bind it to the Selected Item of the styled listbox?

<

phone:PhoneApplicationPage xmlns:telerikPrimitives="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Primitives"
x:Class="ESMIS360.ESAgendaTasksPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:ESMIS360"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
Name="ESAgenda"
SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<phone:PhoneApplicationPage.Resources>
<local:ValueToVisibilityConverter x:Key="ValueToVisibilityConverter" />
<Style x:Key="CtxButton" TargetType="Button">
<Setter Property="Width" Value="200" />
<Setter Property="FontSize" Value="{StaticResource PhoneFontSizeSmall}"/>
</Style>
<DataTemplate x:Name="MyTasks" x:Key="TodayTasks">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Grid.RowSpan="2" Source="{Binding ImageLogo}" VerticalAlignment="Top"/>
<TextBlock Grid.Column="2" Grid.Row="0" Text="{Binding Start}" Style="{StaticResource PhoneTextLargeStyle}"/>
<TextBlock Grid.Column="2" Grid.Row="1" TextWrapping="Wrap" Text="{Binding Subject}" Style="{StaticResource PhoneTextAccentStyle}" VerticalAlignment="Top"></TextBlock>
</Grid>
</DataTemplate>
<Style x:Key="PhotoVieweritemStyle" TargetType="controls:PivotItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="controls:PivotItem">
<ListBox Name="TaskList" ItemsSource="{Binding}" ItemTemplate="{StaticResource TodayTasks}" SelectionChanged="OnSelChange" >
</ListBox>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>


</phone:PhoneApplicationPage.Resources>
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<local:ESProgressBar Grid.Row="0" x:Name="ESBar" ShowProgress="False"></local:ESProgressBar>
<telerikPrimitives:RadModalWindow Name="Actions"  PlacementTarget="{Binding ElementName=LayoutRoot}" Placement="CenterCenter" >
<Border BorderBrush="{StaticResource PhoneBorderBrush}"
BorderThickness="{StaticResource PhoneBorderThickness}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition Height="10"/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="{Binding Start}" Style="{StaticResource PhoneTextLargeStyle}"/>
<TextBlock Grid.Row="1" TextWrapping="Wrap" Text="{Binding Subject}" Style="{StaticResource PhoneTextAccentStyle}" VerticalAlignment="Top"></TextBlock>
<Button Grid.Row="3" Style="{StaticResource CtxButton}" IsEnabled="{Binding Path=Phone, Converter={StaticResource ValueToVisibilityConverter}}" Click="mobilecallclick">
<StackPanel Orientation="Horizontal">
<TextBlock Text="Call: " />
<TextBlock Text="{Binding Phone}"/>
</StackPanel>
</Button>
<Button Grid.Row="4" Style="{StaticResource CtxButton}" IsEnabled="{Binding Path=Phone, Converter={StaticResource ValueToVisibilityConverter}}" Click="mobilesmsclick">
<StackPanel Orientation="Horizontal">
<TextBlock Text="SMS: " />
<TextBlock Text="{Binding Phone}"/>
</StackPanel>
</Button>
<Button Grid.Row="5" Style="{StaticResource CtxButton}" IsEnabled="{Binding Path=Phone, Converter={StaticResource ValueToVisibilityConverter}}" Click="phonecallclick">
<StackPanel Orientation="Horizontal">
<TextBlock Text="Call: " />
<TextBlock Text="{Binding Phone}"/>
</StackPanel>
</Button>
<Button Grid.Row="6" Style="{StaticResource CtxButton}" IsEnabled="{Binding Path=Email, Converter={StaticResource ValueToVisibilityConverter}}" Click="emailclick">
<StackPanel Orientation="Horizontal">
<TextBlock Text="eMail: " />
<TextBlock Text="{Binding Phone}"/>
</StackPanel>
</Button>
<Button Grid.Row="7" Style="{StaticResource CtxButton}" IsEnabled="{Binding Path=Email, Converter={StaticResource ValueToVisibilityConverter}}" Click="mapclick">
<StackPanel Orientation="Horizontal">
<TextBlock Text="Map" />
</StackPanel>
</Button>
</Grid>
</Border>
</telerikPrimitives:RadModalWindow>


<controls:Pivot x:Name="ContentPanel" Grid.Row="1" Title="{Binding Path=ApplicationTitle}">
<controls:PivotItem Name="Today" Header="Today" DataContext="{Binding Path=Agenda.Today}" Style="{StaticResource PhotoVieweritemStyle}"/>
<controls:PivotItem Name="Next7" Header="Next 7days" DataContext="{Binding Path=Agenda.Next7}" Style="{StaticResource PhotoVieweritemStyle}"/>
<controls:PivotItem Name="Next30" Header="Next 30days" DataContext="{Binding Path=Agenda.Next30}" Style="{StaticResource PhotoVieweritemStyle}"/>
</controls:Pivot>
<StackPanel Orientation="Horizontal" Grid.Row="2">
<TextBlock Text="Last Refresh on: " Style="{StaticResource PhoneTextSmallStyle}" />
<TextBlock Text="{Binding Agenda.LoadedOn}" Style="{StaticResource PhoneTextSmallStyle}"/>
</StackPanel>
</Grid>
</

phone:PhoneApplicationPage>

[Stavros Menegos]

It seems that no matter what DataContext I give to the ReadModalWindow (either programmatically or by XAML) it is ignored and the RadModalWindow gets as DataContext what is inherited by the parent control. So in the example below, even if I give DataConext={Binding ElementName=XXX} this is ignored and still the RadModalWindow has as Datacontext the one derived from the parent control.

[Victor]

Hello Stavros Menegos,

 Thank you for writing. This is a known issue and it is fixed in the latest Q1 2011 Beta 2 release. It will be available for download from our website later today.

Please write again if you need assistance with our controls.

Best wishes,
Victor
the Telerik team

[Stavros Menegos]

Yes, I confirm that it was fixed and RadModalWindow datacontext works as expected