Home > Silverlight > Adding dynamic columns in Silverlight Datagrid

Adding dynamic columns in Silverlight Datagrid

This post shows how to add button column to a datagrid(Silverlight) and react to the click event

1.Create a resource for the DataGridtemplateColumn, define CellTemplate
2.After setting the ItemsSource, get the resource we added in step 1 and add it to the grid
 
this is XAML from the page

<UserControl x:Class=”SilverlightApplication1.Page”
    xmlns=”http://schemas.microsoft.com/client/2007
    xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml
    Width=”600″ Height=”600″
             xmlns:data=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data”
             xmlns:local=”clr-namespace:SilverlightApplication1;assembly=SilverlightApplication1″>
    <UserControl.Resources>      
        <data:DataGridTemplateColumn Header=”" x:Name=”dtc”>
            <data:DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <Button Click=”Button_Click” Tag=”{Binding CustomerID}”
                            Content=”Delete”></Button>
                </DataTemplate>
            </data:DataGridTemplateColumn.CellTemplate>
        </data:DataGridTemplateColumn>
    </UserControl.Resources>
  
    <Canvas>
        <data:DataGrid x:Name=”dataGrid1″
                       Height=”400″
                       Width=”450″
                       Margin=”0,5,0,10″
                       AutoGenerateColumns=”True” />
        <TextBlock Text=”Sample Text” x:Name=”txt1″
                   Canvas.Top=”500″
                   Canvas.Left=”100″></TextBlock>
    </Canvas>
</UserControl>

let’s say we are getting data from WCF service

the code to call WCF service will look something like this

BasicHttpBinding b = new BasicHttpBinding();
EndpointAddress addr = new EndpointAddress(“http://localhost/mywebsite/MyService.svc“);
ServiceReference1.MyServiceClient client = new SilverlightApplication1.ServiceReference1.MyServiceClient(b, addr);
client.GetCustomersCompleted += new EventHandler<SilverlightApplication1.ServiceReference1.GetCustomersCompletedEventArgs>(client_GetCustomersCompleted);
client.GetCustomersAsync();

 void client_GetCustomersCompleted(object sender, SilverlightApplication1.ServiceReference1.GetCustomersCompletedEventArgs e)
 {           
            this.dataGrid1.ItemsSource = e.Result;
            //this gets the column from the resources and inserts at the beginning of the row
            this.dataGrid1.Columns.Insert(0, this.Resources["dtc"] as DataGridTemplateColumn);
        }

// this  button click handler sets the text of a Textblock(“txt1″) to customerid of the row in which the button is clicked
 private void Button_Click(object sender, RoutedEventArgs e)
        {
            this.txt1.Text = (sender as Button).Tag.ToString();
        }

Categories: Silverlight Tags: ,
  1. March 20, 2008 at 6:45 pm | #1

    Quite impressing !!!, XAML it’s a real modern markup language. Thanks for the tip.

  2. May 15, 2009 at 9:18 pm | #2

    Thanks Lee – the SelectionChanged handler is a pain in the butt, this gave me what I needed to sidestep it!

  1. No trackbacks yet.