Passing Data from Child Window to Parent Window In Silverlight 3


There were many requirements where we need to pass the value from ChildWindow to our Parent Window in Silverlight. In this article we will see a sample implementation of this requirement to pass the value from the ChildWindow to the Parent Window.

This is the idea what we are going to do. We will select a date from the calendar from the ChildWindow and pass the selected value to the Parent Window and display it.

Creating Silverlight Project

Fire up Visual Studio 2008 and create a new Silverlight 3 Project. Name it as ChildToParent.

Now first things first add a ChildWindow to the Silverlight Project name the ChildWindow as DatePopUpWindow.

Now that we have added everything needed we will design our page in Blend as follows:

I have added one TextBlock to display the Selected Date and one Image; on it’s click the ChildWindow will be fired up.

<TextBlock HorizontalAlignment=”Left” VerticalAlignment=”Top” Text=”Select A Date : “ TextWrapping=”Wrap” Margin=”10,10,0,0″/>

    <TextBlock x:Name=”txtDate” HorizontalAlignment=”Left” VerticalAlignment=”Top” TextWrapping=”Wrap” Margin=”10,30,0,0″/>

    <Image x:Name=”imgCalendar” Height=”32″ HorizontalAlignment=”Left” VerticalAlignment=”Top” Width=”32″ Margin=”108,0,0,0″ Source=”Images/calendar.png” MouseLeftButtonDown=”imgCalendar_MouseLeftButtonDown”/>

Now we will design our Childwindow as follows:

As you see from the above image; I have added a calendar to the ChildWindow.

<controls:Calendar x:Name=”myCalendar” HorizontalAlignment=”Left” d:LayoutOverrides=”Height”/>

<Button x:Name=”CancelButton” Content=”Cancel” Click=”CancelButton_Click” Width=”75″ Height=”23″ HorizontalAlignment=”Right” Margin=”0″ VerticalAlignment=”Center” Grid.Row=”1″ d:LayoutOverrides=”Height” />

<Button x:Name=”OKButton” Content=”OK” Click=”OKButton_Click” Width=”75″ Height=”23″ HorizontalAlignment=”Right” Margin=”0,0,79,0″ VerticalAlignment=”Center” Grid.Row=”1″ d:LayoutOverrides=”Height” />


Now go back to the VisualStudio IDE and open DatePopUpWindow.xaml.cs

Here we will add a event handler.

EventHandler OkClicked;

Add a property that can be accessed from the main window.

DateTime _SelectedDate;


DateTime SelectedDate


get { return _SelectedDate; }

set { _SelectedDate = value; }


Now in the OkButton_Click event add the following code:

void OKButton_Click(object sender, RoutedEventArgs e)


if (OkClicked!=null)


_SelectedDate = (DateTime)myCalendar.SelectedDate;

OkClicked(this, new


this.DialogResult = true;


Now go back to the MainPage.xaml.cs and create an instance of ChildWindow:

DatePopUpWindow calendar;

In the click event of the Image (Calendar) display the ChildWindow and Initiate the Event.

void imgCalendar_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)


calendar = new


calendar.OkClicked += new


In the event handler add the following code to access the data from ChildWindow.

void cw_OkClicked(object sender, EventArgs e)


txtDate.Text = “You have selected : “ + calendar.SelectedDate.ToShortDateString();


That’s it. We are done. Now run your application.

When you click on the Calendar Image the ChildWindow will be displayed.

Select any date and press ok.

Hope you like this simple article.