Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to propagate silverlight usercontrol properties to parent?
    text
    copied!<p>I would like to have some of the properties in the custom user control to be available to the parent page. I created a small sample to illustrate what I am looking for.</p> <p>I am trying to use MVVM pattern and all the binding mechanisms to achieve it.</p> <p>USERCONTROL XAML</p> <pre><code>&lt;UserControl x:Class="TestCustomUserControl.MyControls.UserNameControl" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:TestCustomUserControl.ViewModels" xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400"&gt; &lt;UserControl.Resources&gt; &lt;local:UserNameViewModel x:Key="TheViewModel"/&gt; &lt;/UserControl.Resources&gt; &lt;Grid x:Name="NameCtrlRoot" Background="White" DataContext="{StaticResource TheViewModel}"&gt; &lt;StackPanel&gt; &lt;Grid&gt; &lt;Grid.ColumnDefinitions&gt; &lt;ColumnDefinition Width="Auto" /&gt; &lt;ColumnDefinition /&gt; &lt;/Grid.ColumnDefinitions&gt; &lt;Grid.RowDefinitions&gt; &lt;RowDefinition /&gt; &lt;RowDefinition /&gt; &lt;RowDefinition /&gt; &lt;RowDefinition /&gt; &lt;RowDefinition /&gt; &lt;/Grid.RowDefinitions&gt; &lt;TextBlock Grid.Row="0" Grid.Column="0" Text="First Name:" /&gt; &lt;TextBlock Grid.Row="1" Grid.Column="0" Text="Last Name: "/&gt; &lt;TextBox Grid.Row="0" Grid.Column="1" x:Name="txtFirstName" Text="{Binding FirstName, Mode=TwoWay}"&gt; &lt;i:Interaction.Behaviors&gt; &lt;!-- This behavior updates the binding after a specified delay instead of the user having to lose focus on the TextBox. --&gt; &lt;local:TextChangedDelayedBindingBehavior RefreshTimeMilliseconds="750" /&gt; &lt;/i:Interaction.Behaviors&gt; &lt;/TextBox&gt; &lt;TextBox Grid.Row="1" Grid.Column="1" x:Name="txtLastName" Text="{Binding LastName, Mode=TwoWay}"&gt; &lt;i:Interaction.Behaviors&gt; &lt;!-- This behavior updates the binding after a specified delay instead of the user having to lose focus on the TextBox. --&gt; &lt;local:TextChangedDelayedBindingBehavior RefreshTimeMilliseconds="750" /&gt; &lt;/i:Interaction.Behaviors&gt; &lt;/TextBox&gt; &lt;TextBlock Grid.Row="3" Grid.Column="0" Text="fullname inside control:" /&gt; &lt;TextBlock Grid.Row="3" Grid.Column="1" Text="{Binding FullName}" /&gt; &lt;Border Height="1" Background="Black" Grid.Column="2" Grid.Row="4" /&gt; &lt;/Grid&gt; &lt;/StackPanel&gt; &lt;/Grid&gt; </code></pre> <p></p> <p>the above Usercontrol is binded to the following VIEWMODEL</p> <pre><code>public class BaseViewModel : INotifyPropertyChanged { public event PropertyChangedEventHandler PropertyChanged; protected void NotifyPropertyChanged(string propName) { if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs(propName)); } } public class UserNameViewModel : BaseViewModel { private String _firstName; public String FirstName { get { return _firstName; } set { _firstName = value; NotifyPropertyChanged("FirstName"); OnNameChange(); } } private String _lastName; public String LastName { get { return _lastName; } set { _lastName = value; NotifyPropertyChanged("LastName"); OnNameChange(); } } private void OnNameChange() { FullName = String.Format("{0} {1}", FirstName, LastName); } public String _fullName; public String FullName { get { return _fullName; } set { _fullName = value; NotifyPropertyChanged("FullName"); } } } </code></pre> <p>Consumer Page that uses the above USERCONTROL</p> <pre><code>&lt;navigation:Page xmlns:my="clr-namespace:TestCustomUserControl.MyControls" x:Class="TestCustomUserControl.Views.ConsumeName" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" d:DesignWidth="640" d:DesignHeight="480" Title="ConsumeName Page"&gt; &lt;Grid x:Name="LayoutRoot"&gt; &lt;StackPanel&gt; &lt;my:UserNameControl x:Name="MyNameControl"/&gt; &lt;Grid&gt; &lt;Grid.RowDefinitions&gt; &lt;RowDefinition Height="10" /&gt; &lt;RowDefinition /&gt; &lt;/Grid.RowDefinitions&gt; &lt;Grid.ColumnDefinitions&gt; &lt;ColumnDefinition Width="Auto"/&gt; &lt;ColumnDefinition /&gt; &lt;/Grid.ColumnDefinitions&gt; &lt;TextBlock Grid.Row="1" Grid.Column="0" Text="Full Name in Parent: " /&gt; &lt;TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding FullName, ElementName=MyNameControl}"/&gt; &lt;/Grid&gt; &lt;/StackPanel&gt; &lt;/Grid&gt; </code></pre> <p></p> <p>Here is my question now, If you look at the view model associated with user control, it has a property called FullName and I would like that to be exposed via Usercontrol, so that I can access it from the consuming page. Its like consuming page want to access some of the properties of usercontrol. I am not quite sure as to how that can be acheived. I would like to stick with MVVM pattern.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload