Windows phone 8 app bar command parameter always null - Cimbalino - windows-phone

Question

Xaml Namespaces
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
xmlns:interactivity="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:appBar="clr-namespace:Cimbalino.Phone.Toolkit.Behaviors;assembly=Cimbalino.Phone.Toolkit"
xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.WP8"
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot"
Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel"
Grid.Row="0"
Margin="12,17,0,28">
<TextBlock Text="Beneficiary"
Margin="9,-7,0,0"
Style="{StaticResource PhoneTextTitle1Style}" />
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel"
Grid.Row="1"
Margin="12,0,12,0">
<toolkit:LongListMultiSelector
x:Name="beneficoryList"
ItemsSource="{Binding BeneficoryCollection}"
EnforceIsSelectionEnabled="{Binding DataContext.IsSelectionEnabled, ElementName=LayoutRoot,Mode=TwoWay}">
<!--Is Selection Enabled Changed Command-->
<!--<interactivity:Interaction.Triggers>
<interactivity:EventTrigger EventName="IsSelectionEnabledChanged">
<interactivity:InvokeCommandAction Command="{Binding DataContext.IsSelectionEnabledChangedOn,ElementName=LayoutRoot,Mode=OneTime}"/>
</interactivity:EventTrigger>
</interactivity:Interaction.Triggers>-->
<toolkit:LongListMultiSelector.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}" FontSize="{StaticResource PhoneFontSizeLarge}"/>
<TextBlock Text="{Binding Number}" FontSize="{StaticResource PhoneFontSizeMedium}"/>
<TextBlock Text="{Binding Operator}" FontSize="{StaticResource PhoneFontSizeSmall}"/>
<!-- Interaction region-->
<interactivity:Interaction.Triggers>
<interactivity:EventTrigger EventName="Tap">
<interactivity:InvokeCommandAction Command="{Binding TapCommand}" CommandParameter="{Binding }"/>
</interactivity:EventTrigger>
</interactivity:Interaction.Triggers>
<!-- Interaction region ends-->
</StackPanel>
</DataTemplate>
</toolkit:LongListMultiSelector.ItemTemplate>
</toolkit:LongListMultiSelector>
</Grid>
</Grid>
<interactivity:Interaction.Behaviors>
<appBar:ApplicationBarBehavior x:Name="appBar" IsVisible="True"
BackgroundColor="{StaticResource PhoneAccentColor}"
ForegroundColor="{StaticResource PhoneBackgroundColor}" Mode="Default">
<appBar:ApplicationBarIconButton Text="Add"
IconUri="/Toolkit.Content/ApplicationBar.Add.png"
IsVisible="{Binding IsAddCommandVisible,Mode=TwoWay}"
Command="{Binding AddCommand}"/>
<appBar:ApplicationBarIconButton Text="Delete"
IconUri="/Toolkit.Content/ApplicationBar.Delete.png"
Command="{Binding DeleteCommand,Mode=OneTime}"
CommandParameter="{Binding SelectedItems,ElementName=beneficoryList}"/>
<!--Menu Items-->
<appBar:ApplicationBarBehavior.MenuItems>
<appBar:ApplicationBarMenuItem Text="HelpDesk" />
<appBar:ApplicationBarMenuItem Text="Contact Us"/>
</appBar:ApplicationBarBehavior.MenuItems>
<!--Menu Items End-->
</appBar:ApplicationBarBehavior>
</interactivity:Interaction.Behaviors>
View Model
private RelayCommand<object> _ondeleteCommand;
public RelayCommand<object> DeleteCommand
{
get { return _ondeleteCommand ?? (_ondeleteCommand = new RelayCommand<object>(OnDeleteCommand)); }
}
private void OnDeleteCommand(object tobeDeleted)
{
if (tobeDeleted != null)
{
// Delete
}
}
How do I pass selectedItems of LongListMultiSelector to a command .In the command argument I always getting null. there is no binding errors in the output window.
Cimbalino Guide

Answer 1

xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
xmlns:interactivity="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:appBar="clr-namespace:Cimbalino.Phone.Toolkit.Behaviors;assembly=Cimbalino.Phone.Toolkit"
xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.WP8"
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot"
Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!--App Bar Binding-->
<interactivity:Interaction.Behaviors>
<appBar:ApplicationBarBehavior x:Name="appBar" IsVisible="True"
BackgroundColor="{StaticResource PhoneAccentColor}"
ForegroundColor="{StaticResource PhoneBackgroundColor}" Mode="Default">
<appBar:ApplicationBarIconButton Text="Add"
IconUri="/Toolkit.Content/ApplicationBar.Add.png"
IsVisible="{Binding IsAddCommandVisible,Mode=TwoWay}"
Command="{Binding AddCommand}"/>
<appBar:ApplicationBarIconButton Text="Delete"
IconUri="/Toolkit.Content/ApplicationBar.Delete.png"
Command="{Binding DeleteCommand,Mode=OneTime}"
CommandParameter="{Binding SelectedItems,ElementName=beneficoryList}"/>
<!--Menu Items-->
<appBar:ApplicationBarBehavior.MenuItems>
<appBar:ApplicationBarMenuItem Text="HelpDesk" />
<appBar:ApplicationBarMenuItem Text="Contact Us"/>
</appBar:ApplicationBarBehavior.MenuItems>
<!--Menu Items End-->
</appBar:ApplicationBarBehavior>
</interactivity:Interaction.Behaviors>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel"
Grid.Row="0"
Margin="12,17,0,28">
<TextBlock Text="Beneficiary"
Margin="9,-7,0,0"
Style="{StaticResource PhoneTextTitle1Style}" />
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel"
Grid.Row="1"
Margin="12,0,12,0">
<toolkit:LongListMultiSelector
x:Name="beneficoryList"
ItemsSource="{Binding BeneficoryCollection}"
EnforceIsSelectionEnabled="{Binding DataContext.IsSelectionEnabled, ElementName=LayoutRoot,Mode=TwoWay}">
<toolkit:LongListMultiSelector.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}" FontSize="{StaticResource PhoneFontSizeLarge}"/>
<TextBlock Text="{Binding Number}" FontSize="{StaticResource PhoneFontSizeMedium}"/>
<TextBlock Text="{Binding Operator}" FontSize="{StaticResource PhoneFontSizeSmall}"/>
<!-- Interaction region-->
<interactivity:Interaction.Triggers>
<interactivity:EventTrigger EventName="Tap">
<interactivity:InvokeCommandAction Command="{Binding TapCommand}" CommandParameter="{Binding }"/>
</interactivity:EventTrigger>
</interactivity:Interaction.Triggers>
<!-- Interaction region ends-->
</StackPanel>
</DataTemplate>
</toolkit:LongListMultiSelector.ItemTemplate>
</toolkit:LongListMultiSelector>
</Grid>
</Grid>
The element 'beneficoryList' is not finding in the visual tree, I was placed the app bar outside of the grid , Now I moved the App-bar inside the grid so 'beneficoryList' is now selectedItems is passed to VM . I think WP only allow traversing to just its immediate parent