We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Is it possible to bind a column of a GridTreeControl to more than one property?

Is it possible to bind a column of a GridTreeControl to more than one property?

For example:

My tree displays a list of hierarchical objects of type 'My Item'. The first column which is the 'Name' column should be databinded to 3 properties of the 'MyItem'  class and display it as follows:

  1. A checkbox that is binded to a Boolean property.
  2. An image that its Source is binded to an Enum property and uses a converter to convert from the enum balue to a bitmap resource.
  3. A textblock that is binded to a String property.
An example of how it should look can be seen in the png file I've attached.

Attachment: SelfReferencingTreeGrid_e8233f3a.zip

1 Reply

JS Jayapradha S Syncfusion Team February 11, 2015 03:22 AM UTC

Hi Hagit,

Thank you for using Syncfusion products.

We have analyzed your query and you can add more than one property to a column by using DataTemplate and bind the property using QueryCellInfo Event. In QueryCellInfo Event, you can store the items to e.Style.CellValue2 as shown in the below code snippet,

Code Snippet:

<syncfusion:GridTreeColumn Width="200"   HeaderText="First Name" MappingName="FirstName"  >


                    <syncfusion:GridStyleInfo CellType="DataBoundTemplate">



                                <StackPanel Orientation="Horizontal">

                                    <CheckBox IsChecked="{Binding Style.CellValue2.CheckSelected}"/>


                                     <Image VerticalAlignment="Top" Height="30" Width="30" Source="{Binding Style.CellValue2.Image,

                                                                                                            Converter={StaticResource stringToImageConverter}}"/>


                                    <TextBlock Text="{Binding Style.CellValue2.FirstName}"/>







  treeGrid.ModelLoaded += treeGrid_ModelLoaded;

  void treeGrid_ModelLoaded(object sender, EventArgs e)


            treeGrid.Model.QueryCellInfo += Model_QueryCellInfo;


  void Model_QueryCellInfo(object sender, GridQueryCellInfoEventArgs e)


            if (e.Style.CellType == "DataBoundTemplate")


                var node = treeGrid.InternalGrid.GetNodeAtRowIndex(e.Style.RowIndex);

                if (node != null)


                    var item = node.Item as PersonInfo;

                    e.Style.CellValue2 = item;

                    this.treeGrid.InternalGrid.RowHeights.DefaultLineSize = 50;





We have created a sample to achieve your requirement to adding more than one property to the column and please find the sample from the below location,

Sample Link: GridTreeSample.zip

Note: we don’t have the support to adding this column as left most column.

Kindly let us know if you need any further assistance on this.



Live Chat Icon For mobile
Up arrow icon