Question

I am using Silverlight 4 and the MVVM pattern.

My view model has two properties:

• SomeProperty and
• MyCommand

SomeProperty is a complex type and has a lot of subproperties. MyCommand is a property to handle commanding from a Button.

I have a child window (the view) with a Grid as the LayoutRoot which is bound to the SomeProperty property of the view model.

<Grid x:Name="LayoutRoot" DataContext="{Binding SomeProperty, Mode=TwoWay}">
    ...
</Grid>

However, inside the Grid I want to bind a Button’s Command property to the MyCommand property of the view model:

<Button Command={Binding MyCommand} />

But this is not working because MyCommand is a property of the view model, and not a property of the view model’s SomeProperty property. (When I click on the Button it does not execute the command.)

Anywho, is there a way using data binding in Silverlight 4 such that I can have a container UI element set its DataContext property explicitly, but then have a different control within the container reference a property that’s a sibling (or parent or whatever) of the DataContext of the containing control?

My current workaround is to define the binding in the view’s class, but I’d rather have it in the XAML.

Thanks

Answer 1

If you give your root element (ChildWindow, UserControl, whatever) a name, then you can use ElementName to get to the view model.

<UserControl x:Name="MyUserControl">
    <Grid x:Name="LayoutRoot" DataContext="{Binding SomeProperty, Mode=TwoWay}">
        <Button Command="{Binding MyCommand}" DataContext="{Binding DataContext, ElementName=MyUserControl}" />
    </Grid>
</UserControl>

Or, here’s another way to do the same thing.

<UserControl x:Name="MyUserControl">
    <Grid x:Name="LayoutRoot" DataContext="{Binding SomeProperty, Mode=TwoWay}">
        <Button Command="{Binding DataContext.MyCommand, ElementName=MyUserControl}" />
    </Grid>
</UserControl>