Ahmed.C
Ahmed.C

Reputation: 487

Button inside a custom ListBoxItemTemplate

So what I've done is made my own custom ListBoxItemTemplate. It consists of 3 Textblocks and 1 Button. My XAML For that is:

<DataTemplate x:Key="DataTemplate1">
        <Grid d:DesignWidth="431" d:DesignHeight="109.333" Height="109.333" Width="431">
            <toolkit:ContextMenuService.ContextMenu>
                <toolkit:ContextMenu IsFadeEnabled="True" IsZoomEnabled="False">
                    <toolkit:MenuItem Header="Delete" Click="Delete_Click"/>
                </toolkit:ContextMenu>
            </toolkit:ContextMenuService.ContextMenu>
            <Grid toolkit:TiltEffect.IsTiltEnabled="True" Margin="101,-1,-121,-3">
                <TextBlock Text="{Binding ItemBody}" HorizontalAlignment="Left" VerticalAlignment="Top" Height="26" Width="496"  FontSize="19" Margin="0,62,0,0" FontFamily="Segoe WP">
                    <TextBlock.Foreground>
                        <SolidColorBrush Color="{StaticResource PhoneTextMidContrastColor}"/>
                    </TextBlock.Foreground>
                </TextBlock>
                <TextBlock Text="{Binding FolderID}" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Height="34" Width="496"  FontSize="24" Margin="0,72,0,0" Visibility="Collapsed"/>
                <TextBlock Text="{Binding ItemNumber}" HorizontalAlignment="Left" VerticalAlignment="Top" Height="28" Width="496" FontSize="21" Margin="0,34,0,0" FontFamily="Segoe WP"/>
                <TextBlock Text="{Binding ItemTitle}" HorizontalAlignment="Left" VerticalAlignment="Top" Height="37" Width="496" FontSize="28" FontFamily="Segoe WP"/>
            </Grid>
            <Button x:Name="callPerson" Content="CALL" HorizontalAlignment="Left" Margin="-6,12,0,0" VerticalAlignment="Top" Click="callPerson_Click"/>
        </Grid>
    </DataTemplate>

I've binded my 3 TextBlocks and I've just added a button. Now What I Plan to do is each time the user clicks the button, depnding on what listbox item it is, once the button is clicked it will grab a number from the Observable Collection which I've added in a differnt class file called Collections.cs. The code is:

public class Items
    {
        public string ItemTitle { get; set; }
        public string ItemBody { get; set; }
        public string FolderID { get; set; }
        public string ItemNumber { get; set; }
    }

Now In my MainPage, when the button is clicked it's meant to grab the ItemNumber. The code for that is:

Collections.Items data = (Collections.Items)listBox.SelectedItem;
        PhoneCallTask call = new PhoneCallTask();
        call.DisplayName = data.ItemTitle;
        call.PhoneNumber = data.ItemNumber;
        call.Show();

So it's meant to grab the number and call it But! the problem is that If I click the button without clicking on the ListboxItem itsself first, it's going to throw a null exception. How can I make it so that I don't need to click on the ListBoxItem first instead I can just click on the button and it will grab the number?

Thanks!

Upvotes: 0

Views: 60

Answers (2)

har07
har07

Reputation: 89285

Converting my comment to answer, so that others can spot it easily, since OP confirmed it to be working solution.

We can get Collections.Items corresponding to the Button being clicked from Button's DataContext. Something like this in button clicked event handler :

Collections.Items data = (Collections.Items)((Button)sender).DataContext;

Upvotes: 1

Spook Kruger
Spook Kruger

Reputation: 367

I would rather use an itemscontrol than a listbox. The Listbox is an easy template to use and override but with the selection event handlers it can sometimes hinder performance when creating custom type controls. Try changing your listbox to an itemscontrol:

<ItemsControl ItemSource={binding mycollection}>
  <ItemsControl.ItemTemplate>
     <DataTemplate>
                <!-- Your dataTemplate code here -->
      </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>

Upvotes: 0

Related Questions