New to Telerik UI for WPF? Download free 30-day trial

DataTemplate Selectors

This article shows how to conditionally load different ReadOnly/Edit DataTemplates, according to RadDataForm’s CurrentItem. For some additional information on DataTemplateSelectors, please refer to General FAQ documentation article.

DataTemplate selectors affect both RadDataForm’s auto-generated fields and manually defined ones.

For this tutorial we will extend our example from the Getting Started documentation article by defining custom edit templates in XAML (Example 1).

Example 1: Defining Custom DataTemplateSelector Templates in the EditTemplateSelector

        <Grid> 
                    <Grid.Resources> 
                        <DataTemplate x:Key="MyTemplate"> 
                            <Grid> 
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition/> 
                                    <ColumnDefinition/> 
                                </Grid.ColumnDefinitions> 
                                <Grid.RowDefinitions> 
                                    <RowDefinition/> 
                                    <RowDefinition/> 
                                </Grid.RowDefinitions> 
                                <telerik:DataFormDataField Label="First Name" DataMemberBinding="{Binding FirstName, Mode=TwoWay}" /> 
                                <telerik:DataFormDataField Grid.Column="1" Label="Salary" DataMemberBinding="{Binding Salary, Mode=TwoWay}" /> 
                            </Grid> 
                        </DataTemplate> 
                    </Grid.Resources> 
                    <telerik:RadDataForm x:Name="DataForm1" AutoGenerateFields="True" ReadOnlyTemplate="{StaticResource MyTemplate}"> 
 
                        <telerik:RadDataForm.EditTemplateSelector> 
                            <my:EmployeesEditTemplateSelector> 
                                <my:EmployeesEditTemplateSelector.SmallSalaryTemplate> 
                                    <DataTemplate> 
                                        <StackPanel> 
                                            <telerik:DataFormDataField Label="First Name"   
                                                                   DataMemberBinding="{Binding FirstName}"/> 
                                            <telerik:DataFormDataField Foreground="Black"  
                                                                   Label="Salary"  
                                                                   Background="Blue"  
                                                                   DataMemberBinding="{Binding Salary}" /> 
                                        </StackPanel> 
                                    </DataTemplate> 
                                </my:EmployeesEditTemplateSelector.SmallSalaryTemplate> 
                                <my:EmployeesEditTemplateSelector.BigSalaryTemplate> 
                                    <DataTemplate> 
                                        <StackPanel> 
                                            <telerik:DataFormDataField Label="First Name"  
                                                                   DataMemberBinding="{Binding FirstName}"/> 
                                            <telerik:DataFormDataField Foreground="White"  
                                                                   Label="Salary"  
                                                                   Background="Red"  
                                                                   DataMemberBinding="{Binding Salary}" /> 
                                        </StackPanel> 
                                    </DataTemplate> 
                                </my:EmployeesEditTemplateSelector.BigSalaryTemplate> 
                            </my:EmployeesEditTemplateSelector> 
                        </telerik:RadDataForm.EditTemplateSelector> 
                    </telerik:RadDataForm> 
                </Grid> 

Here we define a DataTemplateSelector(Example 2):

Example 2: Defining a DataTemplateSelector

    public class EmployeesEditTemplateSelector : Telerik.Windows.Controls.DataTemplateSelector 
    { 
        public override DataTemplate SelectTemplate(object item, DependencyObject container) 
        { 
            Employee employee = item as Employee; 
            if (employee == null) 
            { 
                return null; 
            } 
            else if (employee.Salary > 2500) 
            { 
                return this.BigSalaryTemplate; 
            } 
            else 
            { 
                return this.SmallSalaryTemplate; 
            } 
        } 
        public DataTemplate BigSalaryTemplate { get; set; } 
        public DataTemplate SmallSalaryTemplate { get; set; } 
    } 

As a result when RadDataForm is in edit mode the background color of the Salary DataFormDataField will change to red (Figure 1), when the employee's salary is greater than 2500 or blue when it is less.

Figure 1: Result of DataTemplateSelector

Result of DataTemplateSelector

An analogical approach should be used to set a ReadOnlyTemplateSelector.

Find a runnable project of the previous example in the WPF Samples GitHub repository.

In this article