CODEWITHSUNDEEP
c#xamlbindingcommandmvvm-light
timr
timr

Reputation: 6962

Command not being found

I'm making an Windows 8.1 app with MVVM Light for school. The problem I'm facing is with the Command property. I would want to have the clicked Movie object to send it to a different page and display more info about it. However the binding fails: The binding doesn't search in my DataContext but in my Movie model for a command. :(

Error Message:

Error: BindingExpression path error: 'ShowInfoMovieCommand' property not found on 'Howest.NMCT.RottenTomatoes.Models.Movie, Howest.NMCT.RottenTomatoes.Models, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null'. BindingExpression: Path='ShowInfoMovieCommand' DataItem='Howest.NMCT.RottenTomatoes.Models.Movie, Howest.NMCT.RottenTomatoes.Models, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null'; target element is 'Microsoft.Xaml.Interactions.Core.InvokeCommandAction' (Name='null'); target property is 'Command' (type 'ICommand')

My XAML code in my view (The Data Context is set on top of the page)

DataContext="{Binding GroupedItemsPageViewModel, Source={StaticResource Locator}}"

The ItemTemplate for displaying the movies

<DataTemplate x:Key="RottenTomatoesMovieItemTemplate">
    <Grid HorizontalAlignment="Left" Width="250" Height="230">
        <Interactivity:Interaction.Behaviors>
            <Core:EventTriggerBehavior EventName="Tapped">
                <Core:InvokeCommandAction **Command="{Binding ShowInfoMovieCommand}" CommandParameter="{Binding id}"/>**
            </Core:EventTriggerBehavior>
        </Interactivity:Interaction.Behaviors>
        <Border>
            <Image Source="{Binding posters.original}" Stretch="UniformToFill"/>
        </Border>
        <Grid VerticalAlignment="Bottom" Background="#B2CF4400" Height="50">
            <Grid.RowDefinitions>
                <RowDefinition Height="18*"/>
                <RowDefinition Height="21*"/>
                <RowDefinition Height="11*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="24*"/>
                <ColumnDefinition Width="101*"/>
            </Grid.ColumnDefinitions>
            <TextBlock x:Name="TitleTextblock" Text="{Binding title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}"  Margin="15,0,0,0" Grid.ColumnSpan="2"/>
            <Image Source="{Binding ratings.critics_rating, Converter={StaticResource RatingToPhotoConverter}}" Width="15" HorizontalAlignment="Left" Margin="15,0,0,0" Grid.Row="1"/>
            <TextBlock Text="{Binding ratings, Converter={StaticResource RatingToPercentFormat}}" Foreground="{StaticResource ListViewItemOverlaySecondaryForegroundThemeBrush}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap" Grid.Column="1" Grid.Row="1" />
        </Grid>
    </Grid>
</DataTemplate>

My ViewModel for the Page (GroupedItemsPageViewModel)

private void ShowInfoMovie(object clickedMovie)
{
    Debug.WriteLine(clickedMovie);
}

private RelayCommand<object> _showInfoMovieCommand;
public RelayCommand<object> ShowInfoMovieCommand
{
    get
    {
        if (_showInfoMovieCommand == null)
        {
            _showInfoMovieCommand = new RelayCommand<object>(
                param => this.ShowInfoMovie(param)
                );
        }
        return _showInfoMovieCommand;
    }
}

Upvotes: 1

Views: 574

Answers (1)

timr
timr

Reputation: 6962

Never mind found it myself. In my datatemplate my command binding should have been:

<Interactivity:Interaction.Behaviors>
    <Core:EventTriggerBehavior EventName="Tapped">
        <Core:InvokeCommandAction Command="{Binding DataContext.ShowInfoMovieCommand, ElementName=pageRoot}" CommandParameter="{Binding}"/>
    </Core:EventTriggerBehavior>
</Interactivity:Interaction.Behaviors>

While in my ViewModel it's better to catch my own Model (Movie)

private void SetSelectedMovieDestinationView(Movie clickedMovie)
{
//Do Stuff
}

Upvotes: 1

Related Questions