DatePicker movefocus and size of calendar question

3 posts, 1 answers
  1. Marcel
    Marcel avatar
    41 posts
    Member since:
    Jan 2014

    Posted 10 Jun 2015 Link to this post

    Hello,

    I have two questions about the RadDatePicker.

    I have a requirement that the enter-key should be used to select the date and move the focus from the DatePicker to the next control.

    At the moment when I hit enter when a date is selected the calendar will close and the focus goes back to the textbox.

    How can I move the focus to the next control immediately after I select the date, so with one-enter press the date is selected and focus moves to the next control?

    I tried to handle the KeyDown event and the DropDownClosed event, in the event handler I call MoveFocus to the next field, but in both cases the focus remains in the DatePicker?

     My second question, whats the best way to change the size of the calendar, I want it to have a bigger size and bigger font (wider then the DatePicker textbox to which it belongs). How can I accomplish this, without changing the width of the textbox?

    Regards,

    Marcel

     

  2. Answer
    Nasko
    Admin
    Nasko avatar
    588 posts

    Posted 12 Jun 2015 Link to this post

    Hi Marcel,

    1. The observed by you behavior of RadDatePicker is an expected one. Indeed when selection is made the TextBox control part of RadDatePicker receives the focus. So, actually you need to move the focus from the TextBox and not from RadDatePicker. You could achieve this by handling the KeyUp event - using that event we will be sure that selection is made. Inside its implementation using the ChildrenOfType<T> method you will be able to get the TextBox control and using its MoveFocus method to move the focus to the next control.
    private void RadDatePicker_KeyUp(object sender, KeyEventArgs e)
    {
        var datePicker = sender as RadDatePicker;
     
        if (e.Key == Key.Enter)
        {
            var textBox = datePicker.ChildrenOfType<RadWatermarkTextBox>().FirstOrDefault();
            textBox.MoveFocus(new TraversalRequest(FocusNavigationDirection.Next));
        }
    }

    2. In order to achieve the desired appearance you need to modify the default Style of RadCalendar as shown below:
    <telerik:RadDatePicker SelectionChanged="RadDatePicker_SelectionChanged" KeyUp="RadDatePicker_KeyUp">
        <telerik:RadDatePicker.CalendarStyle>
            <Style TargetType="telerik:RadCalendar">
                <Setter Property="Width" Value="400"/>
                <Setter Property="FontSize" Value="20"/>
            </Style>
        </telerik:RadDatePicker.CalendarStyle>
    </telerik:RadDatePicker>

    We hope this will help you.

    Regards,
    Nasko
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for WPF is Visual Studio 2017 Ready
  4. Marcel
    Marcel avatar
    41 posts
    Member since:
    Jan 2014

    Posted 16 Jun 2015 in reply to Nasko Link to this post

    Hello Nasko,

    Thanks it works as expected.

    Marcel

Back to Top