How to select an item in a ListBox and pick the item's name from a DataTemplate in WPF

Question

I am implementing a Download UI in WPF, where every file that is being downloaded will be shown inside a list box in a DataTemplate

<ListBox>
   <ListBox.ItemTemplate>
      <DataTemplate> 
         <TextBlock x:Name="FileName" text={Binding FileName}" />
         <ProgressBar ... />
         <Button Content="Cancel" click="ButtonCancel_Click" />
      </DataTemplate>
   </ListBox.ItemTemplate>
<ListBox>

Now this List is getting populated with all the download information perfectly. Only problem I am having is that when user clicks on Cancel button, to cancel the download, I have to remove an entry from the ObservableCollections. But I don't have the File Name in the click event( I know click event is not MVVM, still I want to do it in click event handler).

Can anyone suggest how do I get the FileName of that particular file when the selectedItem gets cancelled. in The

private void ButtonCancel_Click(...) {}

I don't understand your description, nor the question. Please correct the description to be more precise. — h__, Oct 19 '14 at 19:01
Just out of curiosity, why do you want to do it in code-behind, in button click event handler, if your application implemented using MVVM ? — Michael, Oct 19 '14 at 19:10
Ok, tell me how do I do it command binding... actually its a POC, Not a full fledge dev, that's why — Debhere, Oct 19 '14 at 19:11

score 1 · Accepted Answer · edited May 23 '17 at 12:27

Although I would still encourage you to use MVVM way of dealing with UI events, here's how you can achieve what you want, using Cancel button's click event handler.

First in your xaml, bind file name to Cancel button's Tag property.

<ListBox>
   <ListBox.ItemTemplate>
      <DataTemplate> 
         <TextBlock x:Name="FileName" text={Binding FileName}" />
         <ProgressBar ... />
         <Button Content="Cancel" Tag="{Binding FileName}" 
                 Click="ButtonCancel_Click" />
      </DataTemplate>
   </ListBox.ItemTemplate>
<ListBox>

Then in your click event handler

private void ButtonCancel_Click(object sender, RoutedEventArgs e) 
{
   Button myButton = (Button)sender;
   string fileName = myButton.Tag.ToString();
   // use fileName
}

Edit

Just to add a complete example, that was tested locally, and ensured that works.

XAML

<Window x:Class="WpfTestApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <ListBox Name="listBox1">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock x:Name="FileName" Text="{Binding Path=FileName}" />

                         <Button Content="Cancel" Tag="{Binding Path=FileName}" 
                                 Click="ButtonCancel_Click" />
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</Window>

Code-behind

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            var fileNames = new List<DownloadModel>
            {
                new DownloadModel
                {
                    FileName = "File1"
                }, 
                new DownloadModel
                {
                    FileName = "File2"
                }, 
                new DownloadModel
                {
                    FileName = "File3"
                }
            };

            listBox1.ItemsSource = fileNames;
        }

        private void ButtonCancel_Click(object sender, RoutedEventArgs e)
        {
            var myButton = sender as Button;
            if (myButton.Tag == null)
            {
                MessageBox.Show("Tag value was null.");
            }
            else
            {
                MessageBox.Show(string.Format("File name is {0}", myButton.Tag));
            }
        }
    }

    public class DownloadModel
    {
        public string FileName { get; set; }
    }

`string fileName = myButton.Tag.ToString();` the `Tag` is `null`. Its throwing exceptions. — Debhere, Oct 20 '14 at 08:13
@Debhere then associated `FileName` is also null, and `TextBlock` also shouldn't have any file name. Just add a check to see if `myButton.Tag` is not null, before calling `ToString()` on it. — Michael, Oct 20 '14 at 09:38
Sorry, I it got resolved, I forget to put the `Tag="{Binding Path=FileName}"`, now its working. But Can you give an example if I do it in Command Binding, how it should be, Consider that Command Class is already implemented, — Debhere, Oct 20 '14 at 11:18
Follow [this example](http://www.codeproject.com/Articles/363568/Command-binding-with-Events-a-way-from-simple-to-a), it is pretty straightforward. — Michael, Oct 20 '14 at 11:37

How to select an item in a ListBox and pick the item's name from a DataTemplate in WPF

1 Answers1