Infragistics WPF - WPF Discussion Boards

19-Feb-09 3:25

Hello,

I have a problem with Binding and a ListView.
I have an order system with Orders and Customers.

I tried to make a sort of Datagrid of the order system with TextBoxes so I can edit all the values.
These bind perfectly.
However, I also want a ComboBox in it, with a drop down of all the customers I have.

The XAML code pasted below here has two parts. One with 3 textfields and this ComboBox I speak of, and 1 containing the DataGrid.

<Window x:Class="WpfLookup.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        
    Title="Window1" Height="320" Width="456" Loaded="Window_Loaded">

    <Grid Height="Auto" Width="Auto" Margin="6">
        <Grid.RowDefinitions>
            <RowDefinition Height="115" />
            <RowDefinition Height="28" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="90" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        
        <StackPanel Name="stackPanel1" Margin="0">
            <Label Height="23" Name="label1" Width="Auto" HorizontalAlignment="Stretch" HorizontalContentAlignment="Right" Margin="3">Order ID</Label>
            <Label Height="23" Name="label3" Width="Auto" HorizontalAlignment="Stretch" HorizontalContentAlignment="Right" Margin="3">Customer</Label>
            <Label Height="23" Name="label2" Width="Auto" HorizontalAlignment="Stretch" HorizontalContentAlignment="Right" Margin="3">Order date</Label>
            <Label Height="23" Name="label4" Width="Auto" HorizontalAlignment="Stretch" HorizontalContentAlignment="Right" Margin="3">Ship date</Label>
        </StackPanel>
        <Button Grid.Column="1" Grid.Row="1" Name="btnAdd" HorizontalAlignment="Right" Width="64" Height="22.745" VerticalAlignment="Bottom" Margin="3" Click="btnAdd_Click">Add</Button>
        <Button Grid.Column="1" Grid.Row="1" Name="btnSave" Margin="0,0,75,3" Click="btnSave_Click" Height="22.745" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="64.163">Save</Button>
        <StackPanel Grid.Column="1" Name="stackPanel2">
           <TextBox 
                Text="{Binding Path=orderID, Mode=OneWay}"
                IsReadOnly="True"
                Height="23" Name="textBox1" Width="Auto" Margin="3" />
            <ComboBox
                SelectedValuePath="customerID"
                SelectedValue="{Binding Path=customerID}"
                
                Height="23" Name="cbCustomer" Width="Auto" Margin="3" SelectionChanged="cbCustomer_SelectionChanged">
                
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <Image Source="Images/salome.gif" Height="Auto" Width="Auto" MaxHeight="40" MaxWidth="40"/>
                            <TextBlock Name="tbLastName"  VerticalAlignment="Center" Text="{Binding Path=lastName}" />
                            <TextBlock Name="tbComma" VerticalAlignment="Center" Text=", " />
                            <TextBlock Name="tbFirstName" VerticalAlignment="Center" Text="{Binding Path=firstName}" />
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
                
            </ComboBox>
            <TextBox 
                Text="{Binding Path=orderDate}"
                Height="23" Name="tbOrderDate" Width="Auto" Margin="3" TextChanged="tbOrderDate_TextChanged" />
            <TextBox 
                Text="{Binding Path=shipDate}"
                Height="23" Name="tbShipDate" Width="Auto" Margin="3" TextChanged="tbShipDate_TextChanged" />
            <TextBox
                Name="tbModified"
                Text="{Binding Path=modified, Mode=OneWayToSource}"
                Visibility="Hidden" />
        </StackPanel>
        <Button Grid.Row="1" Name="btnPrevious" HorizontalAlignment="Left" Width="18.18" Height="22.745" VerticalAlignment="Bottom" Margin="3" Click="btnPrevious_Click">&lt;</Button>
        <Button Grid.Row="1" HorizontalAlignment="Right" Name="btnNext" Width="18.18" Height="22.745" VerticalAlignment="Bottom" Margin="3" Click="btnNext_Click">&gt;</Button>
        
        <ListView Name="testView"
            IsSynchronizedWithCurrentItem="True"
            ItemsSource="{Binding}"
            Grid.Row="2" Grid.Column="2" Margin="3">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                </Style>
            </ListView.ItemContainerStyle>
            
            <ListView.View>
                <GridView>
                    <GridViewColumn 
                        Header="Order ID" DisplayMemberBinding="{Binding Path=orderID, Mode=OneWay}" Width="75"/>
                    <GridViewColumn Header="OrderDate" Width="75">
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>  
                                <ComboBox                         
                                    SelectedValuePath="customerID"
                                    SelectedValue="{Binding Path=customerID}"
                                    ItemsSource="{Binding dsCustomer.Customer}"
                                    
                                    Name="cbCustomer2"
                
                                    
                                    Height="23" Width="Auto" Margin="3" SelectionChanged="cbCustomer_SelectionChanged">

                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                                            <StackPanel Orientation="Horizontal">
                                                <Image Source="Images/salome.gif" Height="Auto" Width="Auto" MaxHeight="40" MaxWidth="40"/>
                                                <TextBlock Name="tbLastName"  VerticalAlignment="Center" Text="{Binding Path=lastName}" />
                                                <TextBlock Name="tbComma" VerticalAlignment="Center" Text=", " />
                                                <TextBlock Name="tbFirstName" VerticalAlignment="Center" Text="{Binding Path=firstName}" />
                                            </StackPanel>
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>

                                </ComboBox>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                    </GridViewColumn>
                    <GridViewColumn Header="OrderDate" Width="75">
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <TextBox
                                    Text="{Binding Path=orderDate}"/>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                    </GridViewColumn>
                    <GridViewColumn Header="Ship date" Width="75">
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <TextBox
                                    Text="{Binding Path=shipDate}"/>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                        
                    </GridViewColumn>
                    
                </GridView>
            </ListView.View>         
        </ListView>
    </Grid>
</Window>

If we focus on the first ComboBox:

<ComboBox
                SelectedValuePath="customerID"
                SelectedValue="{Binding Path=customerID}"
                
                Height="23" Name="cbCustomer" Width="Auto" Margin="3" SelectionChanged="cbCustomer_SelectionChanged">
                
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <Image Source="Images/salome.gif" Height="Auto" Width="Auto" MaxHeight="40" MaxWidth="40"/>
                            <TextBlock Name="tbLastName"  VerticalAlignment="Center" Text="{Binding Path=lastName}" />
                            <TextBlock Name="tbComma" VerticalAlignment="Center" Text=", " />
                            <TextBlock Name="tbFirstName" VerticalAlignment="Center" Text="{Binding Path=firstName}" />
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
                
            </ComboBox>

This one works perfectly. But only when I change the ItemsSource in C# code:

this.cbCustomer.ItemsSource = dsCustomer.Customer;

It won't work when I would do it in XAML code:

this.cbCustomer.ItemsSource = dsCustomer.Customer;

Am I doing something wron in the XAML code?
I'm quite new to WPF.

The reason I ask this, is that this ComboBox will return in the datagrid, I can't however name it, because multiple ComboBoxes will be generated, and I don't have the name to use in C# code.

I hope my problem is clear and someone knows what I am doing wrong, thanks in advance for the help. Roll eyes | :rolleyes:

ABitSmart19-Feb-09 4:05

Re: Combobox in Listview [modified]

19-Feb-09 4:05

From the XAML perspective, DataContext for the ComboBox is limited by the ListView's(it's Parent) DataContext. In other words, since ComboBox is the child of ListView it can access DataContext of the ListView and bind itself to that or anything relative to that. You need to set the ItemSource of the ComboBox relative to what is set for the ListView.

What is ListView's DataContext ? Is it collection of Customer's ?

Rolorob19-Feb-09 4:26

19-Feb-09 4:26

I have not set the ListView's DataContext in XAML, but I did this:

this.view = (CollectionView) CollectionViewSource.GetDefaultView(dsOrder.Order);

So it is a collection of Orders.
What I want to display in the ComboBoxes however, are Customers linked (through a foreign key, customerID) in the database). I have the CustomerID of the current row in the listview, but it needs to look a customer up. I managed to do this earlier when I did not yet use a listview. I managed this by using the following code:

this.cbCustomer.ItemsSource = dsCustomer.Customer;

So the combobox gets a different ItemsSource then the rest of the User Interface.

My problem is now, since the TextBoxes get generated in the ListView (depending on the number of orders in the dataset), I am unable to call them by their name in C# code to set the ItemsSource. How do I change just the ComboBoxes, whom have no names, to have the Customer as datasource?

I hope this clarifies the problem.

Edit: To be clear, the other fields work in the Datagrid, Textboxes show the correct values (for this example dates).

modified on Thursday, February 19, 2009 10:33 AM

ABitSmart19-Feb-09 5:16

19-Feb-09 5:16

Check this MSDN[^]. Look for the section "Binding Related DataTables"

You can bind your ListView to the DataRelation between the two tables and can then access data from both the tables in the ListView.

Rolorob19-Feb-09 6:59

Re: Combobox in Listview [modified]

19-Feb-09 6:59

That sounds great, but I have never heard of this DataRelation. I will search about this and test this first thing tomorrow (Netherlands) and let you know if it worked, thanks for the suggestion !

Edit: Didn't see the link you posted at first, but thanks for the reference as well!

Rolorob19-Feb-09 20:44

19-Feb-09 20:44

Got the following exception.
"Cannot have a relationship between tables in different DataSets."

I could place everything in one DataSet, but it would be nice to know a solution when it's not possible to do so. I will try to build it like so that only one DataSet will be used for now, but is there a solution to my problem that works when multiple datasets are used?

modified on Friday, February 20, 2009 2:56 AM

ABitSmart19-Feb-09 21:19

19-Feb-09 21:19

Create a custom data object from the two datasets and bind the custom object instead of the datatable Smile | :)

Rolorob19-Feb-09 22:23

19-Feb-09 22:23

Oke thanks,

Im now working at the earlier hint to put it all in one dataset, but I think I am doing something wrong Wink | ;)

// Create the relationship
            DataTable orderTable = dsOrder.Tables["Order"];
            DataTable customerTable = dsOrder.Tables["Customer"];
            dsOrder.Relations.Add("Order2Customer",
                                 customerTable.Columns["customerID"],
                                 orderTable.Columns["customerID"],
                                 false);

            this.view = (CollectionView)CollectionViewSource.GetDefaultView(orderTable);
            this.DataContext = orderTable;

(the added/changed code in C#)

<TextBox 
                Text="{Binding Path=orderID, Mode=OneWay}"
                IsReadOnly="True"
                Height="23" Name="textBox1" Width="Auto" Margin="3" />
            <ComboBox                
                ItemsSource="{Binding Order2Customer}"                
                SelectedValuePath="customerID"
                SelectedValue="{Binding Path=customerID}"
                
                Height="23" Name="cbCustomer" Width="Auto" Margin="3" SelectionChanged="cbCustomer_SelectionChanged">
                
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <Image Source="Images/salome.gif" Height="Auto" Width="Auto" MaxHeight="40" MaxWidth="40"/>
                            <TextBlock Name="tbLastName"  VerticalAlignment="Center" Text="{Binding Path=lastName}" />
                            <TextBlock Name="tbComma" VerticalAlignment="Center" Text=", " />
                            <TextBlock Name="tbFirstName" VerticalAlignment="Center" Text="{Binding Path=firstName}" />
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
                
            </ComboBox>

(an example of my combobox and a textbox I use in XAML.)

The TextBox binds correctly, the comboBox does not. The relationship should work like this right? But it can't seem to bind to the customer fields...

ABitSmart19-Feb-09 22:48

19-Feb-09 22:48

Try this,

dsOrder.Relations.Add("Order2Customer",
                      orderTable.Columns["customerID"],
                      customerTable.Columns["customerID"],
                      false);

I interchanged the column references.

Rolorob19-Feb-09 23:01

19-Feb-09 23:01

Yes I figured out that I should interchange them indeed, but still with no success.
The ComboBox remains empty. Confused | :confused:

ABitSmart19-Feb-09 23:10

19-Feb-09 23:10

Have you changed the ItemsSource of the ListView to bind to the DataRelation ?

Rolorob19-Feb-09 23:17

19-Feb-09 23:17

First I tried to applied it to a combobox outside of the listview, so I havent altered the listview yet.

But I changed the ComboBox ItemsSource.

<ComboBox
               ItemsSource="{Binding Order2Customer}"
               SelectedValuePath="customerID"
               SelectedValue="{Binding Path=customerID}"

This didn't work sadly.

Then I tried applying it to the ListView like you said:

<ListView Name="testView"
            IsSynchronizedWithCurrentItem="True"
            ItemsSource="{Binding Order2Customer}"
            Grid.Row="2" Grid.Column="2" Margin="3">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                </Style>
            </ListView.ItemContainerStyle>

Now nothing in the ListView can be accessed anymore... :P So it's completely blank Confused | :confused:

I hope you see what I am doing wrong Blush | :O

Thanks for the help so far ofcourse!

ABitSmart19-Feb-09 23:51

Re: Combobox in Listview [modified]

19-Feb-09 23:51

I am referring to the Microsoft example.

"this.view = (CollectionView)CollectionViewSource.GetDefaultView(orderTable)"
What is this for?? I think you do not need this part.

"this.DataContext = orderTable;"
This is setting the Orders table as DataSource for the Window. Am I right?

Maybe simplify the the view and see if data comes ?

Instead of a ComboBox use a TextBox and bind it to Order and Customer table fields and see if it works. Preferable use some other field also from the Customer Table (other than CustomerID).

<ListView Name="testView"
IsSynchronizedWithCurrentItem="True"
ItemsSource="{Binding Order2Customer}"
Grid.Row="2" Grid.Column="2" Margin="3">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Path=OrderTableProp1}" />
<TextBlock Text="{Binding Path=CustomerTableProp2}"/>
<TextBlock Text="{Binding Path=CustomerTableProp3}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListView>

(Replaces the property names.)

Rolorob20-Feb-09 0:21