Combobox in Listview - WPF Discussion Boards

Hello Dudes =)

I want Bind a ComboBox to 2 DataSets/DataTables. One with a Countries list other with myUser data (this always with just 1 line)

the combo list the countries ok, but i dont find the way to bind de SelectedValue to de myUser data...

If I chage it to:
SelectedValue="{Binding ElementName=stData, Path=DataContext.OriginCountryIDColumn, Mode=TwoWay}"/>
The Binding find something to work with, but give me "A TwoWay or OneWayToSource binding cannot work on the read-only property 'OriginCoutryIDColumn' of type 'dtDAL.dsData+UsersDataTable'."
I take the "Mode=TwoWay" out and error persist
I change to "Mode=OneWay" and the SelectedValue don't get the value from the datatable

Can someone turn the light on please? Smile | :)

<pre>
<Page x:Class="DUError"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dt="clr-namespace:WebSGTA"
xmlns:tk="http://schemas.microsoft.com/wpf/2008/toolkit"
Title="DU" MinWidth="300" MinHeight="300" Margin="5,5,5,5" >
<Grid>
<StackPanel Name="stData">
<Grid Name="gdTopo">
<Grid.RowDefinitions>
<RowDefinition Height="55" />
<RowDefinition Height="55" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100*" />
<ColumnDefinition Width="20*" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0" Grid.Row="0" Grid.ColumnSpan ="1" BorderBrush="Gray" BorderThickness="1">
<StackPanel >
<Label>Origin</Label>
<ComboBox Name="cmbCountry"
ItemsSource="{Binding}"
SelectedValuePath="CountryID"
DisplayMemberPath="CountryName"
SelectedValue="{Binding ElementName=stData, Path=DataContext.OriginCountryID, Mode=TwoWay}"/>
</StackPanel>
</Border>
</Grid>
</StackPanel>
</Grid>
</Page>
</pre>

<pre>
Sub Bindings()
Dim dsBase As New dtDAL.dsBase
Dim dsData As New dtDAL.dsData

dsData.Merge(dtDAL.dtSQLSGTA.DataGet(1, 1))
dsBase.Merge(dtDAL.dtSQLSGTA.BaseGet(1, 1))

stData.DataContext = dsData.Users
cmbCountry.DataContext = dsBase.Countries
End Sub
</pre>

Help wanted clipping an image region and saving as new image....

Can someone please help me.

What I what to do is display a picture (image) and drawer a clip region using the mouse on a selected area on the image, this could be a retangle, square or a freehand shape.

I can display the image and clipped region using WPF as below. But what I cannot work out is how to save the clipped region of the image as a new bitmap image. The same problem if I create a image using pathgeometry, I cannot work out how to save the cropped part of the image.

If there is an alternative method instead of using WPF, please advice me.

c# or vb I don't mind, I just need a solution.

Thanks

// Sample 4

// Create the image to clip.

Image myImage = new Image();

Uri imageUri =

new Uri(@"C:\\Documents and Settings\\All Users\\Documents\My Pictures\\Sample Pictures\\Water lilies.jpg", UriKind.Relative);

myImage.Source = new BitmapImage(imageUri);

myImage.Width = 200;

myImage.Height = 150;

myImage.HorizontalAlignment = HorizontalAlignment.Left;

// Use an EllipseGeometry to define the clip region.

EllipseGeometry myEllipseGeometry2 = new EllipseGeometry();

myEllipseGeometry2.Center = new Point(100, 75);

myEllipseGeometry2.RadiusX = 100;

myEllipseGeometry2.RadiusY = 75;

myImage.Clip = myEllipseGeometry2;

RenderTargetBitmap[^] is the key here.

Also check out this blog post by Rick Strahl which I found helpful:
Rendering a WPF Container to Bitmap[^]

I'm trying out Infragistic's WPF controls, and I got this problem:
I'm using XamDataGrid, and I set its DataSource to a DataTable.DefaultView.
The problem starts when I try to add/update/delete any of the rows. I don't expect it do it magically by itself, but I can't seem to find a reasonable mechanism for accomplishing this task.
Any idea what am I missing?

To hell with circumstances; I create opportunities.

Oh... some one else is annoyed with the same thing, too? Smile | :)

To hell with circumstances; I create opportunities.

Hi,

I want to create a wpf GroupBox dynamically . I want to apply specific font and forecolor to the header . Can someone please help me
to do all this in code behind.

Thanks,

Veena

GroupBox gb = new GroupBox();

gb.Header = "GroupBox!";
gb.Foreground = new SolidColorBrush(Colors.Red);
gb.FontSize = 20;
gb.FontWeight = FontWeights.UltraBold;

gb.Content = ...

...

You can also set a groupbox's header to anything you want.

For example, you could set the header as a TextBlock:

GroupBox gb = new GroupBox();

TextBlock tb = new TextBlock();
tb.Text = "My Group";
tb.Foreground = new SolidColorBrush(Colors.Red);
tb.FontSize = 20;
tb.FontWeight = FontWeights.UltraBold;
gb.Header = tb;

gb.Content = ...;

...

Mark

Mark Salsbery
Microsoft MVP - Visual C++
Java | [Coffee]

modified on Thursday, February 19, 2009 10:01 PM

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:

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 ?

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

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.

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!

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

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

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...

Try this,

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

I interchanged the column references.

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

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

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!

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.)

It works when I just put stuff in like orderID, customerID, orderDate.
But one order can be bound to one customer, but I want to display all of the customers in the combobox, this was working previously outside of the listview, now it works nowhere anymore.

But given the customerID, I want to be able to select the correct customer. But I will do some more research because it's hard to describe. I could put one working source file without datagrid, and one with datagrid online, maybe that would be a little bit more clear? Because you will see what's the problem when you run it.

edit:
http://rapidshare.com/files/200322597/WpfLookupProblem.zip.html[^]

Edit:
No database ofcourse.. but still it can help I think?

modified on Friday, February 20, 2009 6:33 AM

I was thinking,and came to the conclusion that binding to the relationship would not suffice. I need to bind to the collection of customers, if I bind to the relationship, only one customer could be returned.

So I think im back where we started :P Find out how to set the ItemsSource of a generated combobox :P

I get a better picture of what you are stuck into. You have to take some more time to design this bugger Smile | :)

The working sample just had a single order displayed. If I understand correct, the problem is when you try to display all the orders together in a DataGrid form. Is that correct ?

You can create a CLR object of customer data. Create a resource in the Window resources,
<local:Customers x:Key="CustomerList"/>
where Customers is CLR object; a collection of Customer information.

Then bind it to the ComboBox inside the ListView, "{Binding Source={StaticResource CustomerList}"
Now, the combobox will have a different datasource than the ListView. But then you will have to handle the combobox selection change etc. in code behind.

I was trying to devise something more concrete.

The working sample just had a single order displayed. If I understand correct, the problem is when you try to display all the orders together in a DataGrid form. Is that correct ?

Not entirely, I could show them all and edit them all at once in the working example.
But it indeed displays only one.

I am able to display the the datagrid btw, I shall show you how it looks in a screenshot:
http://i42.tinypic.com/w03yfn.jpg [^]

I will try your Recource suggestion, I read about it but have not yet tried it.

Yes that is what I was trying to say.

Is it necessary to have the combobox at 2 places ?? You could have it on the top part and in the Grid just display.