Disable keyboard inputs

8 posts, 0 answers
  1. Vonziz
    Vonziz avatar
    17 posts
    Member since:
    Sep 2011

    Posted 12 Apr 2012 Link to this post

    Hi everybody,

    My question is simple : How can I disable keyboard inputs for the DateTimePicker component.
    The user could only select a date  by the calendar and not by the textbox.

    Thanks.

    Best Regards.
  2. Georgi
    Admin
    Georgi avatar
    349 posts

    Posted 17 Apr 2012 Link to this post

    Hello Vonziz,

    In order to restrict keyboard input you need to edit the template of the DateTimePicker. What you can do is change the IsReadOnly property of the WatermarkTextBox to true. Setting this would change its background and it would look like the DateTimePicker is disabled. If you want to keep the background white you need to edit the template of the WatermarkTextBox and set the background to white:

    <Border x:Name="ReadOnlyVisualElement" Background="White" CornerRadius="{StaticResource ControlOuterBorder_CornerRadius}" Opacity="0"/>

    Examples of both scenarios you can find as attached files.

    All the best,
    Georgi
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  3. DevCraft banner
  4. Tim
    Tim avatar
    114 posts
    Member since:
    Aug 2011

    Posted 07 Jan 2013 Link to this post

    Hello telerik!

    I am now trying for hours to get the same functionality (readonly and White Background) with an applied Metro theme... Nothing is working. The Metro theme is set application wide! In the style I set the basedOn to Metro... Nothing gets better... I read something about implicit styles that should help but I don't know how that applies to this simple Scenario...

    Any help???
    Thanks a lot!!!

    Cheers,
    Tim.
  5. Georgi
    Admin
    Georgi avatar
    349 posts

    Posted 08 Jan 2013 Link to this post

    Hi Tim,

    Usually in Metro theme the color for the read only and normal DateTimePicker is the same. Nevertheless we have attached a simple project showing how you can change the background in read only state and use the implicit style in order to apply the theme and therefore the change to all of your DateTimePickers.
    Please note that this is applied according to our latest version (Q3 2012 SP1) and there might be some differences if you are using different control version.
    You can find the changes in Telerik.Windows.Controls.Input.xaml as we have added the following code in the RadWatermarkTextBoxStyle:

    <ObjectAnimationUsingKeyFrames Duration="0:0:0" Storyboard.TargetName="Border" Storyboard.TargetProperty="Background">
        <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Purple" />
    </ObjectAnimationUsingKeyFrames>

    Hope this will help.

    Greetings,
    Georgi
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  6. Tim
    Tim avatar
    114 posts
    Member since:
    Aug 2011

    Posted 08 Jan 2013 Link to this post

    Hi Georgi,

    thanks a lot for your quick reply! But I think we misunderstood a little bit! I don't want to set the whole datepicker readonly! Only the textbox! Just like it is written herer: http://www.telerik.com/help/silverlight/raddatetimepicker-how-to-select-only-picker.html But I don't get it to run with the Metro theme... If I try to change the template, it goes back to the black default style!

    Any ideas?
    Thanks a lot again!
    Cheers,
    Tim.
  7. Georgi
    Admin
    Georgi avatar
    349 posts

    Posted 11 Jan 2013 Link to this post

    Hi Tim,

    I am sorry for the misunderstanding.
    Using the approach from the article won't be straightforward as Expression Blend currently generates only the default Office Black theme. If you need to customize RadDateTimePicker for Metro theme, you need to take the style from the Themes.Implicit folder, Metro subfolder.
    I am attaching a simple project showing the easiest way to achieve the described behavior. You can find the style for the DateTimePicker and the Watermark in the App.xaml file as they are applied to the every DateTimePicker and Watermark in the project.
    If you have any questions, please don't hesitate to contact us.

    All the best,
    Georgi
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  8. Tim
    Tim avatar
    114 posts
    Member since:
    Aug 2011

    Posted 11 Jan 2013 Link to this post

    Hi Georgi,

    thanks a lot for your help! Now it is working! :)

    One last thing - if it is easy to implement:
    As the textbox is readonly anyway, it doesn't make sense (except for copy-paste the date) that the text is selectable - better would be if the whole control would show the datepicker if it is clicked... Is something like this easily achievable?

    But anyway - thanks a lot! Now it looks much better!
    Cheers,
    Tim.
  9. Georgi
    Admin
    Georgi avatar
    349 posts

    Posted 16 Jan 2013 Link to this post

    Hi Tim,

    I see way you wan to apply the described behavior, but it seems like there is no easy way to achieve it. A possible approach  can be to create custom DateTimePicker, overwrite the OnApplyTemplate and open the DropDown when there is a click on the RadWatermarkTextBox (if read only). Also you can achieve similar behavior when opening the  the DropDown on GotFocus() event of the DateTimePicker:

    private void dateTimePicker_GotFocus(object sender, RoutedEventArgs e)
            {
                dateTimePicker.IsDropDownOpen = true;
            }

    If you have any questions, please don't hesitate to write us.

    Kind regards,
    Georgi
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top
DevCraft banner