Windows Phone - how display two items on ListBox

Question

In my project, i have two ListBox. The first is populated from JSON file. So de user select one item and click "Add" button, the item is added to ListBox 2. But, I have an "amount" TextBox and I want that its content appears on ListBox 2 also.

Following example:

How is it my screen:

_{(source: infassteste.url.ph)}

As it should be:

_{(source: infassteste.url.ph)}

My code:

    private void AddProd(object sender, RoutedEventArgs e)
    {

        if (ListBoxx.SelectedItem != null)
        {
            Fields fi = (Fields)this.ListBoxx.SelectedItem;

            ListBoxx2.Items.Add(fi);

        }
        else
        {
            MessageBox.Show("Selecione um item para adicionar!");
        }
    }

My XAML:

<ListBox Name="ListBoxx"
         FontSize="30"
         HorizontalContentAlignment="Stretch"
         ItemsSource="{Binding Items}" Margin="10,10,10,411" BorderBrush="Red">
                    <ListBox.Background>
                        <SolidColorBrush Color="#FFC3C3C3" Opacity="0.51"/>
                    </ListBox.Background>

                    <!-- Template to display each item -->
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="200" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>

                                <TextBlock Grid.Column="0" Text="{Binding FNome}"/>
                                <TextBlock Grid.Column="1" Text="{Binding FEstado}"/>
                            </Grid>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>

<ListBox x:Name="ListBoxx2"
                    FontSize="30"
                    HorizontalContentAlignment="Stretch"
                     Margin="10,311,10,10" BorderBrush="Red">
                    <ListBox.Background>
                        <SolidColorBrush Color="#FFC3C3C3" Opacity="0.51"/>
                    </ListBox.Background>

                    <!-- Template to display each item -->
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="200" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>

                                <TextBlock Grid.Column="0" Text="{Binding FNome}"/>
                                <TextBlock Grid.Column="1" Text="{Binding FEstado}"/>
                            </Grid>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>

Answer 1

Add a property to your Fields class to hold the quantity. Lets call it Quantity. The Modify the ListBoxx2 ItemTemplate like this.

<ListBox.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
             </Grid.ColumnDefinitions>
             <TextBlock Grid.Column="0" Text="{Binding FNome}"/>
             <TextBlock Grid.Column="1" Text="{Binding FEstado}"/>
             <TextBlock Grid.Column="2" Text="{Binding Quantity}"/>
         </Grid>
     </DataTemplate>
 </ListBox.ItemTemplate>

Then in the click event of the Button, add the following..

private void AddProd(object sender, RoutedEventArgs e)
{
    if (ListBoxx.SelectedItem != null)
    {
        Fields fi = (Fields)this.ListBoxx.SelectedItem;
        fi.Quantity = txtQuantity.Text; // SET THE Quantity..
        ListBoxx2.Items.Add(fi);
    }
    else
    {
        MessageBox.Show("Selecione um item para adicionar!");
    }
}

Then the value in the textbox is added to the object and it is bound to the ListBox ItemTemplate

Answer 2

Define new property to you class that is displayed in ListBox and bound and bind it to third TextBlock. (FNome, FEstado).

In your AddProd method you can get instance of your custom class from ListBoxx.SelectedItem and change your new property.