Windows Phone 7 - Function for ListBox button

Question

I have list of items in ListBox.
All the items have buttons.
I want to show the selected items name when I click the button inside the ListBox (Not the list box items).

My Xaml:-

<ListBox SelectedIndex="{Binding SelectedIndex,Mode=TwoWay}"  
         SelectedItem="{Binding SelectedStudent, Mode=TwoWay}" Height="374" 
         ItemsSource="{Binding StudentDetails,Mode=TwoWay}" 
         HorizontalAlignment="Left" Margin="2,6,0,0" Name="listBox1" 
         VerticalAlignment="Top" Width="476" BorderBrush="#00410D0D">
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Tap">
            <i:InvokeCommandAction Command="{Binding EventPageCommand, Mode=OneWay}"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Border BorderBrush="Gray" Padding="5" BorderThickness="1">
                <StackPanel Orientation="Horizontal">
                    <Border BorderBrush="Wheat" BorderThickness="1">
                        <Image Name="ListPersonImage" Source="{Binding PersonImage}" 
                               Height="100" Width="100" Stretch="Uniform" Margin="10,0,0,0"/>
                    </Border>
                    <TextBlock Text="{Binding FirstName}" Name="firstName" Width="200" 
                               Foreground="White" Margin="10,10,0,0" 
                               FontWeight="SemiBold" FontSize="22"  />

                    <Button Height="80" Width="80" Command="{Binding addPerson}" 
                            DataContext="{Binding DataContext, ElementName=listBox1}">
                        <Button.Background>
                            <ImageBrush 
                                ImageSource="/NewExample;component/Images/icon_increase.png" />
                        </Button.Background>
                    </Button>
                </StackPanel>
            </Border>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Here when I click the 'addPerson' Button it should show the selected items name.
Now I have write the coding for List box 'SelectedItmes'.

My ViewModel:-

 private MVVMListBoxModel selectedStudent;
public MVVMListBoxModel SelectedStudent
{
    get { return selectedStudent; }
    set
    {
        if (selectedStudent == value)
            return;
        selectedStudent = value;
        MessageBox.Show("Selected Item==>" + selectedStudent.FirstName + " Selected Index==>" + SelectedIndex);
        if (SelectedIndex == 0)
        {
            var rootFrame = (App.Current as App).RootFrame;
            rootFrame.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));
        }
    }
}

Here I can show the selected Name when I click the list box items.
But now I want to show when I click the button.
Is it possible to show the items when I click the button?

Now I have tried like this:-

public ReactiveAsyncCommand addPerson { get; set; }

public MVVMListBoxViewModel()
{
    addPerson = new ReactiveAsyncCommand();
    addPerson.Subscribe(x =>
    {
        MessageBox.Show("Button Clicked..!!");
            ListBox listbox = (ListBox)sender;
            ListBoxEventsModel items = (ListBoxEventsModel)listbox.SelectedItem;
            MessageBox.Show("Selected Name" + items.ToString());
    });
}

But here I can not show the selected items.
Please let me any idea to solve this issue.

Please post the declaration of addPerson is it a field or a property? — csharpwinphonexaml
Hi @Verdsrobert. I have add the addPerson declaration in my original question. — Vijay
I know that what I'm about to say is not much MVVM but just to test that your command is bound, you could subscribe to Loaded event on Button and check that it's Command Property is set and that its value is equal to your addPerson ReactiveAsyncCommand. — csharpwinphonexaml

csharpwinphonexaml csharpwinphonexaml · Accepted Answer · 2014-04-25T11:15:13

To make sure that your code is working Make some tests like this:

<Button Tap="btnTestCommand_Tap" Height="80" Width="80" Command="{Binding addPerson}" 
        DataContext="{Binding DataContext, ElementName=listBox1}">
    <Button.Background>
        <ImageBrush ImageSource="/NewExample;component/Images/icon_increase.png" />
    </Button.Background>
</Button>

Code behind:

private void btnTestCommand_Tap(object sender, GestureEventArgs e)
{
    Button btn=sender as Button;
    var command = btn.Command;
    MessageBox.Show("Entering Command Check\n DataContext is of type: "+btn.DataContext.GetType().Name);

    if(command !=null)
    {
        MessageBox.Show("Command is not null");
        if(command is ReactiveAsyncCommand)
        {
            MessageBox.Show("Command is of ReactiveAsyncCommand type");
        }
    }
}

Windows Phone 7 - Function for ListBox button

1 Answers