Develop Reference

Bindings on Datagrids in code Behind

I'm working on a cookbook for myself, written in WPF/C#.
Additionally I'm new to Data Bindings.
My Problem is, I want to generate a Datagrid in a TabItem on runtime in code behind, including Bindings. I can't set a Datagrid at XAML because I want to create all TabItems dynamically.
Following Code so far:
XAML:
<UniformGrid Columns="2" Rows="1">
<TabControl Name="TabControl" TabStripPlacement="Left"/>
<TabItem Header= "first dish" Name = "firstdish"/>
</UniformGrid>
XAML.cs for generation:
//New Grid
var Grid = new DataGrid();
//Start Test list creation with three items
var TestList = new List<Receipt>();
//Set binding
Grid.ItemsSource = TestList;
var Rec = new Receipt();
Rec.Creator = "DaJohn1";
Rec.ID = 1;
Rec.Title = "TestReceipt1";
var Rec2 = new Receipt();
Rec2.Creator = "DaJohn2";
Rec2.ID = 2;
Rec2.Title = "TestReceipt2";
var Rec3 = new Receipt();
Rec3.Creator = "DaJohn3";
Rec3.ID = 3;
Rec3.Title = "TestReceipt3";
TestList.Add(Rec);
TestList.Add(Rec2);
TestList.Add(Rec3);
//End Test list creation
//Add Column
var SingleColumn = new DataGridTextColumn();
Grid.Columns.Add(SingleColumn);
SingleColumn.Binding = new Binding("Creator");
SingleColumn.Header = "Creator";
//Add Column
var SingleColumn2 = new DataGridTextColumn();
Grid.Columns.Add(SingleColumn2);
SingleColumn2.Binding = new Binding("Title");
SingleColumn2.Header = "Title";
//Set tabitem content to datagrid
firstdish.Content = Grid;
All I'm getting is an datagrid with four rows (looks like the count of Items is right), which are all empty, no data to be seen.
I'm staring at this since last Weeks Monday and can't find an answer anywhere.
Thanks for any ideas and solutions.

try changing
var TestList = new List<Receipt>();
to
var TestList = new ObservableCollection<Receipt>();
as it automatically notifies UI about changes.
I had a similar problem with items not rendering so this may be it.

I've taken your code and checked some of the things you do: The main error is that in your xaml code you created the Tab Control and then Put the TabItem outside it, Tabitem must be inside the control for it to work correctly. so First error is:
<TabControl Name="TabControl" TabStripPlacement="Left">
<TabItem Header="First dish" Name = "firstdish" />
</TbControl>
Other things you need to do before going on in my opinion are:
Assign your window or other UI element itself as datacontext
Verify that your Receipt class implements the INotifyPropertyChanged event that has to be raised by all its properties, or implement your properties as DependencyProperties (even if the latter is not necessary)
Transform your datasource TestList in an ObservableCollection
Create TestList as a class property not a local variable so that it is into the datacontext
I've made a small sample using the above indication and your code to let you see better how that works. You can download the zip here:
TestClassDataGrid.zip

Below code should work for you,
XAML:
<TabControl Name="TabControl" TabStripPlacement="Left">
<TabItem Header= "first dish" Name = "firstdish"/>
</TabControl>
.cs file
public Window()
{
InitializeComponent();
var Grid = new DataGrid();
//Start Test list creation with three items
var TestList = new List<Receipt>();
//Set binding
Grid.ItemsSource = TestList;
var Rec = new Receipt();
Rec.Creator = "DaJohn1";
Rec.ID = 1;
Rec.Title = "TestReceipt1";
var Rec2 = new Receipt();
Rec2.Creator = "DaJohn2";
Rec2.ID = 2;
Rec2.Title = "TestReceipt2";
var Rec3 = new Receipt();
Rec3.Creator = "DaJohn3";
Rec3.ID = 3;
Rec3.Title = "TestReceipt3";
TestList.Add(Rec);
TestList.Add(Rec2);
TestList.Add(Rec3);
//End Test list creation
//Add Column
var SingleColumn = new DataGridTextColumn();
Grid.Columns.Add(SingleColumn);
SingleColumn.Binding = new Binding("Creator");
SingleColumn.Header = "Creator";
//Add Column
var SingleColumn2 = new DataGridTextColumn();
Grid.Columns.Add(SingleColumn2);
SingleColumn2.Binding = new Binding("Title");
SingleColumn2.Header = "Title";
//Set tabitem content to datagrid
Grid.AutoGenerateColumns = false;
firstdish.Content = Grid;
}

Dynamically bind GridView CellTemplate content

I'm using GridView with a ListView control to show some catalog content. I'm loading the ListView content dynamically with code behind, creating GridViewColumns and binding them to properties in my custom catListItem class.
var view = new GridView();
var binding = new Binding("Name");
var resElement = _mResourceManager.GetElementByMdlID("vlu_usw_name_of");
view.Columns.Add(new GridViewColumn { Header = resElement.Name, DisplayMemberBinding = binding });
binding = new Binding("Number");
resElement = _mResourceManager.GetElementByMdlID("vlu_usw_arc_logical_nmbr");
view.Columns.Add(new GridViewColumn { Header = resElement.Name, DisplayMemberBinding = binding });
Everything is fine, but now I'm trying to add column with some icon, using the CellTemplate property of the GridViewColumn. Something like this:
var view = new GridView();
var col = new GridViewColumn { Header = "" };
var template = new System.Windows.DataTemplate(typeof(Image));
col.CellTemplate = template;
view.Columns.Add(col);
var binding = new Binding("Name");
var resElement = _mResourceManager.GetElementByMdlID("vlu_usw_name_of");
view.Columns.Add(new GridViewColumn { Header = resElement.Name, DisplayMemberBinding = binding });
binding = new Binding("Number");
resElement = _mResourceManager.GetElementByMdlID("vlu_usw_arc_logical_nmbr");
view.Columns.Add(new GridViewColumn { Header = resElement.Name, DisplayMemberBinding = binding });
I know there's a priority when using DisplayMemberBinding, CellTemplate and CellTemplateSelector.
So my question is:
How can I create (set, ...) content of the CellTemplate and probably bind it to a property of my custom class dynamically? I don't know what do I miss! I've searched for that issue, but everything I found is XAML solutions using DataTemplate.
It's important to do it with code behind.
Thanks in advance!

Actually I found the solution
HERE
I had to use FrameworkElementFactory. Here's the code I was looking for:
var column = new GridViewColumn { Header = "" };
var customTemplate = new System.Windows.DataTemplate();
var efImage = new FrameworkElementFactory(typeof(Image));
efImage.SetBinding(Image.SourceProperty, new Binding("Icon"));
customTemplate.VisualTree = efImage;
column.CellTemplate = customTemplate;
view.Columns.Add(column);

how to create C# code for below XAML code?

I have done below code in XAML. But, I dont wanna create Text Binding in XAML. Is there anyway to create the same method in C# programmatically ?
XAML CODE:
<TextBox Name="contentBox" Text="{Binding Content, Mode=TwoWay}" AcceptsReturn="True" />

TextBox tb = new TextBox();
tb.Name = "contentBox";
tb.AcceptsReturn = true;
Binding b = new Binding("Content");
b.Mode = BindingMode.TwoWay;
b.Source = this; // set you DataContext here
tb.SetBinding(TextBlock.TextProperty, b);

It will look something like this:
var tb = new TextBox();
tb.SetValue(NameProperty, "contentBox");
tb.AcceptsReturn = true;
var b = new Binding("Content");
b.Mode = BindingMode.TwoWay;
b.UpdateSourceTrigger = UpdateSourceTrigger.PropertyChanged;
BindingOperations.SetBinding(tb, TextBox.TextProperty, b);
You will still need to implement an INotifyPropertyChanged class for your DataContext, and manually insert the code-created TextBox into your visual tree somewhere.

Binding binding = new Binding();
binding.Mode = BindingMode.TwoWay;
binding.Path = new PropertyPath("Content"); //Name of the property in Datacontext
BindingOperations.SetBinding(contentBox,TextBox.TextProperty , binding);

How to retrieve an element from a DataTemplate and bind to it?

I am trying to get a handle on an element within my DataTemplate in code. I am creating a series of DataGridTemplateColumns in code which I then assign to a grid.
I want to be able to retrieve the DataTemplate from the xaml, find my element and bind to that particular element.
Here is a short sample code what I am trying to achieve:
<DataTemplate x:Key="dataTemplate">
<Grid TextBlock.Foreground="LightGreen" Background="Yellow">
<TextBlock x:Name="txt" />
</Grid>
</DataTemplate>
DataGridTemplateColumn col = new DataGridTemplateColumn();
col.Header = "Last Name";
Binding b = new Binding("LastName");
DataTemplate dtemplate = (DataTemplate)FindResource("dataTemplate");
TextBlock textBlock = dtemplate.FindName("txt", this);
textBlock.SetBinding(TextBlock.TextProperty, b);
col.CellTemplate = dtemplate;
grid.Columns.Add(col);
Maybe to explain this further:
I am trying to create a set of DataGridTemplateColumns on the fly and apply that to a Datagrid. Since I don't know the property to bind to until the time a source gets presented to me I cannot create a DataTemplate that nested within itself has this binding already build in. Like:
<TextBlock Text={Binding=LastName} ... >
So I am forced to create a set of DataGridTemplateColumn in runtime, look for DataTemplate in my resources and THEN try to bind that column to a property (like LastName) on my datasource.

I would approach this via CellStyle instead:
<DataGrid.Resources>
<Style x:Key="CellStyle" TargetType="{x:Type DataGridCell}">
<Setter Property="TextBlock.Foreground" Value="LawnGreen"/>
<Setter Property="Background" Value="Yellow"/>
</Style>
</DataGrid.Resources>
DataGridTextColumn col = new DataGridTextColumn();
col.Binding = new Binding("Name");
col.CellStyle = dataGrid.Resources["CellStyle"] as Style;
dataGrid.Columns.Add(col);
There are also ways to do this via DataTemplates but it does not seem necessary in this case (unless your problem is more complex).

My solution to the problem is something like this:
GridView viewLayout = new GridView();
for (int i = 0; i < Apprefs.tables[0].Headers.Count(); i++)
{
GridViewColumn gvc = new GridViewColumn();
string colName = Apprefs.tables[0].Headers[i];
gvc.Header = colName;
gvc.Width = 80;
gvc.CellTemplate = SetTemplete(i); ;
viewLayout.Columns.Add(gvc);
}
listview1.View = viewLayout;
//set binding
listview1.ItemsSource = Apprefs.tables[0].Rows;
and then:
/// <summary>
/// Create DataTemplate
/// </summary>
/// <param name="i"></param>
/// <returns></returns>
private DataTemplate SetTemplete(int i)
{
DataTemplate template = new DataTemplate();
//set stack panel
FrameworkElementFactory sp = new FrameworkElementFactory(typeof(StackPanel));
sp.Name = "spBind";
sp.SetValue(StackPanel.OrientationProperty, Orientation.Horizontal);
//set textblock
FrameworkElementFactory tb = new FrameworkElementFactory(typeof(TextBlock));
sp.Name = "tbBind";
Binding b = new Binding();
string ito = "[" + i.ToString() + "]"; // bind by index
b.Path = new PropertyPath(ito);
tb.SetBinding(TextBlock.TextProperty, b);
sp.AppendChild(tb);
//set the visual tree of the data template
template.VisualTree = sp;
return template;
}

silverlight xaml to C#

can someone give the C# equivalent of this xamle code?
<ListBox Width="400" Margin="10"
ItemsSource="{Binding Source={StaticResource myTodoList}}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Path=TaskName}" />
<TextBlock Text="{Binding Path=Description}"/>
<TextBlock Text="{Binding Path=Priority}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
That's because I would like to know how to dynamically add PivotItems into a Pivot, for a windows phone 7 app, with the default Pivot layout generate in VS 2010. For instance, I got this code, but I didn't find a way to add the StackPanel object sp, to ListBox:
// epgXml is an XElement object, wich has channel and programmes tags
// it's an app about a tv guide, where the user clicks on a channel and gets a list of programmes for that channe.
// in th xaml code, I have a grid with a pivot object in it:
<Grid x:Name="LayoutRoot" Background="Transparent">
<controls:Pivot x:Name="MainPivot" ItemsSource="{Binding PivotItems}" Title="ZON EPG">
</controls:Pivot>
</Grid>
// In MainViewModel.cs I have this code:
public void client_GetEPGCompleted(Object sender, GetEPGCompletedEventArgs e)
{
DataTemplate dt = new DataTemplate();
epgXml = e.Result.Output.EPGXml;
if (epgXml != null)
{
//Channels = new List<string>();
// parse the xml and show channels and programmes
var channels = from c in epgXml.Elements("channel")
select c;
foreach (XElement el in channels)
{
PivotItem pi = new PivotItem();
pi.Header = el.Elements("display-name").FirstOrDefault().Value;
ListBox lb = new ListBox();
lb.Margin = new Thickness(0, 0, -12, 0);
//ItemsControl ic = new ItemsControl();
//ic.ItemTemplate = dt;
lb.ItemTemplate = dt;
StackPanel sp = new StackPanel();
sp.Margin = new Thickness(0, 0, 0, 17);
sp.Width = 432;
TextBlock tb = new TextBlock();
Binding binding = new Binding("ProgTitle");
binding.Mode = BindingMode.TwoWay;
tb.SetBinding(TextBlock.TextProperty, binding);
tb.Margin = new Thickness(12, 0, 0, 0);
tb.TextWrapping = TextWrapping.NoWrap;
tb.Style = Application.Current.Resources["PhoneTextExtraLargeStyle"] as Style;
sp.Children.Add(tb);
tb = new TextBlock();
binding = new Binding("ProgStart");
binding.Mode = BindingMode.TwoWay;
tb.SetBinding(TextBlock.TextProperty, binding);
tb.Margin = new Thickness(12, -6, 0, 0);
tb.TextWrapping = TextWrapping.NoWrap;
tb.Style = Application.Current.Resources["PhoneTextSubtleStyle"] as Style;
sp.Children.Add(tb);
tb = new TextBlock();
binding = new Binding("Duration");
binding.Mode = BindingMode.TwoWay;
tb.SetBinding(TextBlock.TextProperty, binding);
tb.Margin = new Thickness(12, 0, 0, 0);
tb.TextWrapping = TextWrapping.NoWrap;
tb.Style = Application.Current.Resources["PhoneTextSubtleStyle"] as Style;
sp.Children.Add(tb);
// get programmes foreach channel
var progrs = from p in epgXml.Elements("programme")
where p.Attributes("channel").FirstOrDefault().Value == el.Attributes("id").FirstOrDefault().Value
select new ItemViewModel()
{
ProgTitle = p.Elements("title").FirstOrDefault().Value,
ProgStart = p.Attributes("start").FirstOrDefault().Value,
Duration = p.Elements("length").FirstOrDefault().Value
};
foreach (ItemViewModel item in progrs)
{
this.Items.Add(item);
}
// create new instance - this holds all the programms for each channel
this.Items = new ObservableCollection<ItemViewModel>();
PivotItems.Add(pi);
}
Thx in advance

You have to use XamlReader to create datatemplates (as in your XAML) on the phone.
See a full example and explanation at http://www.windowsphonegeek.com/tips/wp7-dynamically-generating-datatemplate-in-code
For an example off dynamically adding PivotItems seee How to dynamically add pivot item and add Image to each pivot item?