Version

We recommend that you use the xamDataGrid control instead of the xamGrid control. The xamGrid is being planned for retirement over the next few years and will not receive any new features. We will continue to provide support and critical bug fixes for the xamGrid during this time. For help or questions on migrating your codebase to the xamDataGrid, please contact support.

Template Column Layout

In certain cases, your xamGrid control may have to visualize large data structures containing lots of information. Most of the time your end users will require only a summary view. Other times, your end users will also need to drill into the details of the specific item.

The Template Column Layout is a feature in the xamGrid control that allows you to add row data detail view to the control. This feature allows you to define the layout in a custom manner through the use of a template.

When a template column layout is included in a column layout, an expansion indicator will appear for each row. Clicking on the expansion indicator expands the row to make the template visible; clicking on it again collapses the template.

For example, if you have a grid that contains a column with a person’s name, you may not want to display that person’s information as separate columns in the grid, but still want all your end users to see the information if required. You can achieve this by creating a Column Template Layout that contains this information. When your end user clicks on the expansion indicator, the additional information will be displayed.

The following code demonstrates how to add a template column layout to xamGrid.

In XAML:

<ig:XamGrid Grid.Row="0" x:Name="MyDataGrid" AutoGenerateColumns="False">
   <ig:XamGrid.Columns>
      <ig:TextColumn Key="ProductID"/>
      <ig:TextColumn Key="ProductName"/>
      <ig:TemplateColumnLayout Key="UnitPrice">
         <ig:TemplateColumnLayout.Template>
            <DataTemplate>
               <Grid>
                  <TextBox Text="{Binding UnitPrice}"/>
               </Grid>
            </DataTemplate>
         </ig:TemplateColumnLayout.Template>
      </ig:TemplateColumnLayout>
   </ig:XamGrid.Columns>
</ig:XamGrid>
Sorting