In an ItemsSource, how would I dynamically create a button click event for each and individual Item

Question

I'm pretty sure I worded the question very wrong, this (in my opinion) was really hard to word out. But I'll give more background information

What I am trying to do: I am making an ItemsSource which helps store information from a Json API, I am using a for loop that continuously creates a border containing a thumbnail, the title, and a button that opens the link to the website.

The problem: The problem I am encountering is how I can't really make my own Click event onto the button, because on every Item, the link is different, there are more than likely 100+ sets worth of thumbnails, links, and titles. I really don't think I could make that many Click events in my c# code.

An example: Image 4 borders in a WrapPanel, that contain different titles, thumbnails, and different links to press in each border.

What is expected to happen: When pressing each and every different button from each border, that click event on the button should redirect me to a different website. Let's say when I click the button in border #1, it should redirect me to "number1.com" and when I click the button in the second border, it should redirect me to "number2.com", hopefully you get the idea.

The code (idk if it helps lol)

 ```

using (WebClient wc = new WebClient())
                    {    
                    dynamic _api = JsonConvert.DeserializeObject(wc.DownloadString("json link"));
                        for (int i = 0; i < _api.Count; i++)
                        {
                            CreateScript(_api[i].title.ToString(), _api[i].excerpt.ToString(), _api[i].featured_image.thumbnail.ToString());
                            await Task.Delay(500);
                        }
                    }

    try
                {
                    Dispatcher.Invoke(() =>
                    {
                        this.GetScriptLinks.Add(new ScriptLinks { link = link, thumbnail = thumbnail, title = title });
                        CloudGrid.Height = (CloudGrid.Height + 75);
                        
                    });
                }
                catch (Exception e)
                {
                    MessageBox.Show(e.ToString());
                }

<ItemsControl x:Name="ScriptItemControl">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <WrapPanel/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate >
                                <DataTemplate>
                                    <Border Margin="15,10,0,0" Background="#363636" Height="203" Width="279" VerticalAlignment="Top">
                                        <Border.Resources>
                                            <Style TargetType="{x:Type Border}">
                                                <Setter Property="CornerRadius" Value="12"/>
                                            </Style>
                                        </Border.Resources>
                                        <Grid>
                                            <Button Click={bind a dynamically created click evennt}>
                                                <Button.Resources>
                                                    <Style TargetType="Border">
                                                        <Setter Property="CornerRadius" Value="8"/>
                                                    </Style>
                                                </Button.Resources>
                                            </Button>
                                            <Image Source="{Binding Path=thumbnail}" Margin="0,0,0,0" Width="300" Height="150">
                                            </Image>
                                            <TextBlock Text="{Binding Path=title}" Margin="21,10,81,147" FontSize="20" Foreground="White" FontFamily="Atkinson Hyperlegible" TextWrapping="Wrap"/>
                                        </Grid>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>

Answer 1

Bind the button's Command property to an ICommand and reference the DataContext as the Window to be able to access the ICommand for the Window, not just the ItemsControl.

Also pass the button's CommandParameter to the ICommand with the valueCommandParameter = {Binding } That will return the value of the clicked item to the ICommand handler. You can then process multiple, different parameters in the single ICommand handler according to the value of returned parameter. The returned parameter Type will be the Type of the elements in the ItemsSource collection.