Silverlight and the Date Picker Control

I worked on an issue recently with a customer that was very interesting.
They were using Silverlight 2.0 and this issue does not reproduce in Silverlight 3.

They were using the DatePicker Control for their project and noticed that the Watermark “enter text here” would appear if they changed focus away from the Date Picker.

The repro was pretty simple.

The XAML looked like this.

x:Class="SilverlightApplication3.Page" xmlns="" xmlns:x="" Width="400" Height="300"> <Grid x:Name="LayoutRoot" Background="White"> <StackPanel> <basics:DatePicker x:Name="datePicker" Width="130" Margin="10"></basics:DatePicker> <Button Width="130" Height="25"></Button> </StackPanel> </Grid> </UserControl>

And the code looked like this.

namespace SilverlightApplication3
    public partial class Page : UserControl
        public Page()
            datePicker.SelectedDate = DateTime.Now;


We pick up the <enter text here> from the DatePickerTextBox_DefaultWatermarkText resource so we’ll need to do something to work around this.

So I came up with this solution.

1) Add a new Silverlight Class library to your project.
2) Set this class up to inherit from the DatePicker control.

Then write some code like this.

    public class Class1 : DatePicker
        public override void OnApplyTemplate()
            DatePickerTextBox box = base.GetTemplateChild("TextBox") as DatePickerTextBox;
            if (box != null)
                box.Watermark = "<Enter a Date>";

Then you can use the new control and your page and when the focus changes from the DatePicker control you have a watermark that asks for a Date rather than text.

I hope this helps.

Skip to main content