Calendar popup open so far when culture set to Arabic

[Hiren]

Hello Sir,

When i have set Page culture to arabic RadDatePicker popup behave strange. Its open so far from the input box.

For more detail i have attached the Project as well as screen shot. 

DatePicker Source Code

Awaiting for your reply.


Thanks,
Hiren

[Boyan]

Hello,

We are aware of this problem, it is caused by setting the FloatDirection property to RightToLeft, that makes the popup to calculate wrong its coordinates.

It is a bug in our controls and we have logged it in our PITS. You can follow its progress here.

We are sorry for the inconvenience, most probably the fix will be available for one of the next internal builds and officially will be included in Q1 which is due in the middle of February.

Greetings,
Boyan
the Telerik team

[Jayesh]

Hello All,

I have resolved this issue by changing style of RadDateTimePicker control.
You have to do following changes in style.
...
...
<Setter Property="Template">
    <Setter.Value>
     <ControlTemplate TargetType="telerik:RadDateTimePicker">
      <Grid>
       <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="15"/>
       </Grid.ColumnDefinitions>
...
...
</VisualStateManager.VisualStateGroups>
<Border x:Name="BackgroundVisual" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.ColumnSpan="2" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"/>
       <Border x:Name="MouseOverVisual" BorderBrush="{StaticResource ControlOuterBorder_MouseOver}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" IsHitTestVisible="False" Opacity="0" Visibility="Collapsed"/>
       <Border x:Name="FocusVisual" BorderBrush="{StaticResource ControlOuterBorder_Focused}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" IsHitTestVisible="False" Visibility="Collapsed">
        <Border BorderBrush="{StaticResource ControlInnerBorder_Focused}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{StaticResource SplitButton_SpanInnerCornerRadius}"/>
       </Border>
       <telerik:RadDropDownButton x:Name="PART_DropDownButton" CloseOnEnter="True" Grid.ColumnSpan="2" Grid.Column="0" DropDownIndicatorVisibility="Collapsed" telerik:DateTimePickerExtensions.FocusContentOnOpen="True" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" IsTabStop="False" IsOpen="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="0 0 0 0" Padding="0" telerik:StyleManager.Theme="{StaticResource Theme}" TabIndex="1" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch">
        <telerik:RadDropDownButton.DropDownContent>
         <Grid>
          <Grid.ColumnDefinitions>
           <ColumnDefinition Width="*"/>
           <ColumnDefinition Width="*"/>
          </Grid.ColumnDefinitions>
          <Grid.RowDefinitions>
           <RowDefinition/>
           <RowDefinition/>
          </Grid.RowDefinitions>
          <telerik:RadCalendar x:Name="PART_Calendar" Culture="{TemplateBinding Culture}" Grid.Column="0" DisplayDateEnd="{Binding DisplayDateEnd, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" DateSelectionMode="{TemplateBinding DateSelectionMode}" DisplayDateStart="{Binding DisplayDateStart, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" DisplayDate="{Binding DisplayDate, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" IsReadOnly="{TemplateBinding IsReadOnly}" Grid.Row="0" Style="{TemplateBinding CalendarStyle}" SelectableDateEnd="{Binding SelectableDateEnd, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" SelectionMode="Single" SelectedDate="{Binding SelectedDate, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" SelectableDateStart="{Binding SelectableDateStart, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"/>
          <telerik:DateTimePickerClock x:Name="PART_Clock" Culture="{TemplateBinding Culture}" Grid.Column="1" EndTime="{TemplateBinding EndTime}" IsReadOnly="{TemplateBinding IsReadOnly}" ItemsSource="{TemplateBinding ClockItemsSource}" Grid.Row="0" Style="{TemplateBinding ClockStyle}" SelectedTime="{Binding SelectedTime, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" StartTime="{TemplateBinding StartTime}" TimeInterval="{Binding TimeInterval, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"/>
          <Border x:Name="CloseButtonContainer" BorderBrush="{StaticResource CalendarOuterBorder}" BorderThickness="1 0 1 1" Background="{StaticResource PanelBackground}" Grid.ColumnSpan="2" Grid.Row="1">
           <Border BorderBrush="{StaticResource CalendarInnerBorder}" BorderThickness="1 0 1 1">
            <telerik:RadToggleButton x:Name="PART_Close" HorizontalAlignment="Right" IsThreeState="False" IsBackgroundVisible="False" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="2" Padding="8 3" telerik:LocalizationManager.ResourceKey="Close" Style="{StaticResource CloseButtonStyle}"/>
           </Border>
          </Border>
         </Grid>
        </telerik:RadDropDownButton.DropDownContent>
        <telerik:RadDropDownButton.Template>
         <ControlTemplate TargetType="telerik:RadDropDownButton">
          <Grid>
           <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
           <telerik:Popup x:Name="DropDownPopup">
            <ContentPresenter x:Name="DropDownPopupContent" ContentTemplate="{TemplateBinding DropDownContentTemplate}" Content="{TemplateBinding DropDownContent}" DataContext="{Binding DataContext, RelativeSource={RelativeSource TemplatedParent}}"/>
           </telerik:Popup>
          </Grid>
         </ControlTemplate>
        </telerik:RadDropDownButton.Template>
        <Grid HorizontalAlignment="Right">
         <Telerik_Windows_Controls_Chromes:ButtonChrome x:Name="ButtonChrome" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{StaticResource SplitButton_RightPartCornerRadius}" RenderMouseOver="{Binding IsMouseOver, ElementName=PART_DropDownButton}" telerik:StyleManager.Theme="{StaticResource Theme}" />
         <ContentControl x:Name="DropDownIcon" Background="{StaticResource ButtonIconBackground_Normal}" Foreground="{StaticResource ButtonIconForeground_Normal}" IsTabStop="False" Template="{StaticResource CalendarIcon}" />
        </Grid>
       </telerik:RadDropDownButton>
       <telerik:RadWatermarkTextBox x:Name="PART_DateTimeInput" BorderBrush="{x:Null}" BorderThickness="0" Background="{x:Null}" Grid.Column="0" CurrentText="{Binding CurrentDateTimeText, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsReadOnly="{TemplateBinding IsReadOnly}" Margin="{TemplateBinding BorderThickness}" MinHeight="0" Padding="{TemplateBinding Padding}" SelectionOnFocus="SelectAll" TextAlignment="{TemplateBinding TextAlignment}" Text="{Binding DateTimeText, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" telerik:StyleManager.Theme="{StaticResource Theme}" TabIndex="0" VerticalAlignment="Stretch" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" WatermarkTemplate="{TemplateBinding DateTimeWatermarkTemplate}" WatermarkContent="{TemplateBinding DateTimeWatermarkContent}"/>
       <Telerik_Windows_Controls_Chromes:ValidationTooltip x:Name="ValidationTooltip" Grid.ColumnSpan="2" TooltipPlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}" telerik:StyleManager.Theme="{StaticResource Theme}" TooltipContent="{Binding (Validation.Errors), RelativeSource={RelativeSource TemplatedParent}}" Visibility="Collapsed"/>
       <telerik:Popup IsOpen="{Binding IsTooltipOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Owner="{Binding RelativeSource={RelativeSource TemplatedParent}}" Placement="Top" PlacementTarget="{Binding ElementName=PART_DateTimeInput}">
        <ContentPresenter ContentTemplate="{TemplateBinding TooltipTemplate}" Content="{TemplateBinding TooltipContent}"/>
       </telerik:Popup>
</Grid>
     </ControlTemplate>

Thanks,
jayesh jogani

[Georgi]

Hello,

I am glad to inform you that the issue is fixed and you no longer need to use custom style.
You can find the fix in the Q1 2012 release of RadControls.

All the best,
Georgi
the Telerik team