I need to Delete a Control inside a WrapPanel created dynamically inside another WrapPanel while in Run-Time

Question

So, I have a main WrapPanel called "valoresPanel". When I start running I need to click the Button labeled "2" (below) and a TextBox needs to appear inside the WrapPanel labeled "1" thats was created in runtime.

This is my code for the "+ button" right now:

void novoValor_Click(object sender, RoutedEventArgs e)
       {
           WrapPanel wpValores = new WrapPanel();

           Button deleteValor = new Button();
           TextBox txtValor = new TextBox();

           deleteValor.Height = 25;
           deleteValor.Width = 25;
           deleteValor.Content = "X";

           txtValor.Height = 25;
           txtValor.Width = 70;
           txtValor.Margin = new Thickness(0, 0, 8, 0);

           wpValores.Height = 25;
           wpValores.Width = 105;

           wpValores.Children.Add(deleteValor);
           wpValores.Children.Add(txtValor);

           valoresPanel.Children.Add(wpValores);

           deleteValor.Click += deleteValor2_Click;
       }  

So, i updated my code using only one WrapPanel per item, now i can add a item, add values and delete the item with its respective values but i cant delete a specific value, this is my code by now:

this image will help to understand

 void novoValor_Click(object sender, RoutedEventArgs e)
        {
            Button btn = sender as Button;
            WrapPanel wpFather = btn.Parent as WrapPanel;
            WrapPanel wpValue = new WrapPanel();

            Button deleteValue = new Button();
            TextBox txtValue = new TextBox();

            wpValue.Height = 25;
            wpValue.Width = 105;

            deleteValue.Height = 25;
            deleteValue.Width = 25;
            deleteValue.Content = "-";

            txtValue.Height = 25;
            txtValue.Width = 70;
            txtValue.Margin = new Thickness(0, 0, 8, 0);

            wpValue.Children.Add(deleteValue);
            wpValue.Children.Add(txtValue);

            wpFather.Children.Add(wpValue);

            deleteValue.Click += deleteValor_Click;
        }

        void deleteValor_Click(object sender, RoutedEventArgs e)
        {
            Button btn = sender as Button;
            WrapPanel panel = btn.Parent as WrapPanel;
            entradasPanel.Children.Remove(panel);
        }

If someone need any other information im willing to send it as fast as I can!

Answer 1

You should create a ListView which has a WrapPanel as ItemsPanel. Then to the ListView.ItemsSource you bind an ObservableCollection of data models. By defining a DataTemplate for the ListView.ItemTemplate you can make the data items be displayed as a TextBox with a Button where the TextBox binds to this item's data model. By pressing the delete button you simply remove this data model from the ObservaleColection ( the ItemsSource of the ListView).

DataModel.cs

class DataModel
{
  public string UserInput { get; set; }
}

ViewModel.cs

class ViewModel
{
  public ObservableCollection<DataModel> Items { get; set; }
  public ICommand AddItemCommand => new AsyncRelayCommand(() => this.Items.Add(new DataModel()));    
  public ICommand RemoveItemCommand => new AsyncRelayCommand((item) => this.Items.Remove(item));

  public ViewModel()
  {
    this.Items = new ObservableCollection<DataModel>();
  }
}

MainWindow.xaml

<Window>
  <Window.DataContext>
    <ViewModel />
  </Window.DataContext>

  <StackPanel>
    <Button Content="Add Item"
            Command="{Binding AddItemCommand}" />

    <ListView ItemsSource="{Binding Items}">
      <ListView.ItemsPanel>
        <ItemsPanelTemplate>
          <WrapPanel Width="600" />
        </ItemsPanelTemplate>
      </ListView.ItemsPanel>

      <ListView.ItemTemplate>
        <DataTemplate DataType="{x:Type DataModel}">
          <StackPanel Orientation="Horizontal">
            <Button Content="Remove Item"
                    Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListView}, Path=DataContext.RemoveItemCommand}"
                    CommandParameter="{Binding}" />
            <TextBox Text="{Binding UserInput}" />
          </StackPanel>
        </DataTemplate>
      </ListView.ItemTemplate>
    </ListView>
  </StackPanel>
</Window>

Answer 2

I could solve my last question with the following code:

    void deleteValue_Click(object sender, RoutedEventArgs e)
    {
        Button btn = sender as Button;
        WrapPanel panel = btn.Parent as WrapPanel;
        WrapPanel panelPai = panel.Parent as WrapPanel;
        panelPai.Children.Remove(panel);
    }