What is the of telerik RadDataForm equivalent to toolkit dataform

[Sriman]

 I need to replace the the toolkit dataform with the telerik dataform.

Attached is the sample code and the output.

<

 

 

UserControl

 

x

 

 

:Class="EMAdmin.Modules.Parts.Views.EditPartsView"

 

xmlns

 

 

="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

 

xmlns

 

 

:x="http://schemas.microsoft.com/winfx/2006/xaml"

 

xmlns

 

 

:d="http://schemas.microsoft.com/expression/blend/2008"

 

xmlns

 

 

:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

 

xmlns

 

 

:telerik="http://schemas.telerik.com/2008/xaml/presentation"

 

xmlns

 

 

:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"

 

xmlns

 

 

:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"

 

xmlns

 

 

:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.SL4"

 

xmlns

 

 

:cmdextras="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.SL4"

 

mc

 

 

:Ignorable="d"

 

d

 

 

:DesignHeight="440"

 

d

 

 

:DesignWidth="800"

 

 

 

 

><Grid

 

 

 

x:Name="LayoutRoot"

 

 

 

Background="White"

 

 

 

Margin="4">

 

 

 

 

<Grid.RowDefinitions>

 

 

 

 

<RowDefinition

 

 

 

Height="Auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="Auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="Auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="*" />

 

 

 

 

<RowDefinition

 

 

 

Height="Auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="Auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="Auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="Auto" />

 

 

 

 

</Grid.RowDefinitions>

 

 

 

 

<TextBlock

 

 

 

TextWrapping="Wrap"

 

 

 

Text="Parts"

 

 

 

FontSize="13.333"

 

 

 

FontWeight="Bold"

 

 

 

HorizontalAlignment="Center"

 

 

 

Margin="0,0,0,20" />

 

 

 

 

<StackPanel

 

 

 

Grid.Row="1"

 

 

 

Margin="0,0,0,20">

 

 

 

 

<Grid

 

 

 

Margin="0,0,0,4">

 

 

 

 

<Grid.ColumnDefinitions>

 

 

 

 

<ColumnDefinition

 

 

 

Width="150" />

 

 

 

 

<ColumnDefinition

 

 

 

Width="*" />

 

 

 

 

</Grid.ColumnDefinitions>

 

 

 

 

<TextBlock

 

 

 

Grid.Column="0"

 

 

 

Text="Part Category Name:"

 

 

 

Margin="0,0,4,0"></TextBlock>

 

 

 

 

<ComboBox

 

 

 

Grid.Column="1"

 

 

 

x:Name="PartCategoryCB"

 

 

 

Width="200"

 

 

 

ItemsSource="{Binding PartCategories}"

 

 

 

SelectedItem="{Binding SelectedPartCategory, Mode=TwoWay}"

 

 

 

DisplayMemberPath="DESCRIPTION"

 

 

 

HorizontalAlignment="Left" />

 

 

 

 

</Grid>

 

 

 

 

<Grid

 

 

 

Margin="0,0,0,4">

 

 

 

 

<Grid.ColumnDefinitions>

 

 

 

 

<ColumnDefinition

 

 

 

Width="150" />

 

 

 

 

<ColumnDefinition

 

 

 

Width="*" />

 

 

 

 

</Grid.ColumnDefinitions>

 

 

 

 

<TextBlock

 

 

 

Grid.Column="0"

 

 

 

Text="Part SubCategory Name:"

 

 

 

Margin="0,0,4,0"></TextBlock>

 

 

 

 

<ComboBox

 

 

 

Grid.Column="1"

 

 

 

x:Name="PartSubCategoryCB"

 

 

 

Width="200"

 

 

 

ItemsSource="{Binding PartSubCategories}"

 

 

 

SelectedItem="{Binding SelectedPartSubCategory, Mode=TwoWay}"

 

 

 

DisplayMemberPath="PARTSUBCATEGORY"

 

 

 

HorizontalAlignment="Left" />

 

 

 

 

</Grid>

 

 

 

 

</StackPanel>

 

 

 

 

<StackPanel

 

 

 

Grid.Row="2"

 

 

 

Margin="0,0,0,20">

 

 

 

 

<Button

 

 

 

x:Name="ApprovePartsB"

 

 

 

Content="Approval"

 

 

 

HorizontalAlignment="Right"

 

 

 

Width="200"

 

 

 

FontWeight="Bold"

 

 

 

IsEnabled="{Binding IsApprover}"

 

 

 

Command="{Binding ApproveParts, Mode=OneWay}"

 

 

 

Grid.Row="2" />

 

 

 

 

</StackPanel>

 

 

 

 

<telerik:RadGridView

 

 

 

Grid.Row="3"

 

 

 

x:Name="PartsGrid"

 

 

 

ActionOnLostFocus="None"

 

 

 

CanUserDeleteRows="False"

 

 

 

ShowGroupPanel="False"

 

 

 

IsReadOnly="False"

 

 

 

ItemsSource="{Binding PartItems}"

 

 

 

AutoGenerateColumns="False"

 

 

 

IsEnabled="{Binding GridEnabled}"

 

 

 

SelectionChanging="PartsGrid_SelectionChanging"

 

 

 

ScrollViewer.VerticalScrollBarVisibility="Auto"

 

 

 

RowDetailsVisibilityMode="VisibleWhenSelected">

 

 

 

 

<telerik:RadContextMenu.ContextMenu>

 

 

 

 

<telerik:RadContextMenu

 

 

 

x:Name="radContextMenu">

 

 

 

 

<Button

 

 

 

x:Name="CopyPartB"

 

 

 

Content="Copy Part"

 

 

 

HorizontalAlignment="Right"

 

 

 

Width="Auto"

 

 

 

Command="{Binding CopyPart, Mode=TwoWay}"

 

 

 

Grid.Row="5" />

 

 

 

 

</telerik:RadContextMenu>

 

 

 

 

</telerik:RadContextMenu.ContextMenu>

 

 

 

 

<i:Interaction.Triggers>

 

 

 

 

<i:EventTrigger

 

 

 

EventName="LoadingRowDetails">

 

 

 

 

<cmdextras:EventToCommand

 

 

 

Command="{Binding LoadingRowDetails}"

 

 

 

PassEventArgsToCommand="True" />

 

 

 

 

</i:EventTrigger>

 

 

 

 

<i:EventTrigger

 

 

 

EventName="UnloadingRowDetails">

 

 

 

 

<cmdextras:EventToCommand

 

 

 

Command="{Binding UnloadingRowDetails}"

 

 

 

PassEventArgsToCommand="True" />

 

 

 

 

</i:EventTrigger>

 

 

 

 

<i:EventTrigger

 

 

 

EventName="SelectionChanged">

 

 

 

 

<cmdextras:EventToCommand

 

 

 

Command="{Binding SelectionChanged }"

 

 

 

PassEventArgsToCommand="True" />

 

 

 

 

</i:EventTrigger>

 

 

 

 

</i:Interaction.Triggers>

 

 

 

 

<telerik:RadGridView.Columns>

 

 

 

 

<telerik:GridViewDataColumn

 

 

 

Header="Part Number"

 

 

 

IsReadOnly="True"

 

 

 

DataMemberBinding="{Binding PartNumber}"

 

 

 

SortingState="Ascending"

 

 

 

UniqueName="PartNumber"></telerik:GridViewDataColumn>

 

 

 

 

<telerik:GridViewDataColumn

 

 

 

Header="Core App Part Number"

 

 

 

IsReadOnly="True"

 

 

 

DataMemberBinding="{Binding CoreAppPartNumber}"

 

 

 

UniqueName="CoreAppPartNumber"></telerik:GridViewDataColumn>

 

 

 

 

<telerik:GridViewDataColumn

 

 

 

Header="Part Description"

 

 

 

IsReadOnly="True"

 

 

 

DataMemberBinding="{Binding PartDescription}"

 

 

 

UniqueName="PartDescription"></telerik:GridViewDataColumn>

 

 

 

 

</telerik:RadGridView.Columns>

 

 

 

 

<telerik:RadGridView.RowDetailsTemplate>

 

 

 

 

<DataTemplate>

 

 

 

 

<telerik:RadDataForm x:Name="PartDF" AutoEdit="True" AutoCommit="False" CurrentItem="{Binding AttribPart,Mode=TwoWay}"

 

 

 

CommitButtonContent="Save Changes"

 

 

 

CancelButtonContent="Clear Form">

 

 

 

 

<i:Interaction.Triggers>

 

 

 

 

<i:EventTrigger

 

 

 

EventName="EditEnded">

 

 

 

 

<cmdextras:EventToCommand

 

 

 

Command="{Binding UpdatePart}"

 

 

 

PassEventArgsToCommand="True" />

 

 

 

 

</i:EventTrigger>

 

 

 

 

<i:EventTrigger

 

 

 

EventName="ContentLoaded">

 

 

 

 

<cmdextras:EventToCommand

 

 

 

Command="{Binding BeginEdit, Mode=OneWay}"

 

 

 

PassEventArgsToCommand="True">

 

 

 

 

</cmdextras:EventToCommand>

 

 

 

 

</i:EventTrigger>

 

 

 

 

</i:Interaction.Triggers>

 

 

 

 

<telerik:RadDataForm.EditTemplate>

 

 

 

 

<DataTemplate>

 

 

 

 

<Grid>

 

 

 

 

<Grid.RowDefinitions>

 

 

 

 

<RowDefinition

 

 

 

Height="auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="auto" />

 

 

 

 

<RowDefinition

 

 

 

Height="auto" />

 

 

 

 

</Grid.RowDefinitions>

 

 

 

 

<StackPanel

 

 

 

x:Name="rootPanel"

 

 

 

Grid.Row="0"

 

 

 

Orientation="Vertical"

 

 

 

toolkit:DataField.IsFieldGroup="True"

 

 

 

d:LayoutOverrides="Width, Height"

 

 

 

Height="0">

 

 

 

 

<toolkit:DataField

 

 

 

LabelPosition="Left"

 

 

 

Label="Dummy Field:">

 

 

 

 

<TextBox

 

 

 

Text="{Binding HasChanges, Mode=TwoWay}" />

 

 

 

 

</toolkit:DataField>

 

 

 

 

</StackPanel>

 

 

 

 

<StackPanel

 

 

 

x:Name="PropertiesPanel"

 

 

 

Grid.Row="1">

 

 

 

 

<TextBlock

 

 

 

Text="Properties"

 

 

 

FontSize="13.333"

 

 

 

FontWeight="Bold" />

 

 

 

 

</StackPanel>

 

 

 

 

<StackPanel

 

 

 

x:Name="TechCharPanel"

 

 

 

Grid.Row="2">

 

 

 

 

<TextBlock

 

 

 

Text="Technical Characteristics"

 

 

 

FontSize="13.333"

 

 

 

FontWeight="Bold" />

 

 

 

 

</StackPanel>

 

 

 

 

<StackPanel

 

 

 

x:Name="NonTechCharPanel"

 

 

 

Grid.Row="3">

 

 

 

 

<TextBlock

 

 

 

Text="Non-Technical Characteristics"

 

 

 

FontSize="13.333"

 

 

 

FontWeight="Bold" />

 

 

 

 

</StackPanel>

 

 

 

 

</Grid>

 

 

 

 

</DataTemplate>

 

 

 

 

</telerik:RadDataForm.EditTemplate>

 

 

 

 

</telerik:RadDataForm>

 

 

 

 

 

<!--<toolkit:DataForm

 

x:Name="PartDF"

AutoEdit="True"

AutoCommit="False"

CurrentItem="{Binding AttribPart,Mode=TwoWay}"

CommitButtonContent="Save Changes"

CancelButtonContent="Clear Form">

<i:Interaction.Triggers>

<i:EventTrigger

EventName="EditEnded">

<cmdextras:EventToCommand

Command="{Binding UpdatePart}"

PassEventArgsToCommand="True" />

</i:EventTrigger>

<i:EventTrigger

EventName="ContentLoaded">

<cmdextras:EventToCommand

Command="{Binding BeginEdit, Mode=OneWay}"

PassEventArgsToCommand="True">

</cmdextras:EventToCommand>

</i:EventTrigger>

</i:Interaction.Triggers>

<toolkit:DataForm.EditTemplate>

<DataTemplate>

<Grid>

<Grid.RowDefinitions>

<RowDefinition

Height="auto" />

<RowDefinition

Height="auto" />

<RowDefinition

Height="auto" />

<RowDefinition

Height="auto" />

</Grid.RowDefinitions>

<StackPanel

x:Name="rootPanel"

Grid.Row="0"

Orientation="Vertical"

toolkit:DataField.IsFieldGroup="True"

d:LayoutOverrides="Width, Height"

Height="0">

<toolkit:DataField

LabelPosition="Left"

Label="Dummy Field:">

<TextBox

Text="{Binding HasChanges, Mode=TwoWay}" />

</toolkit:DataField>

</StackPanel>

<StackPanel

x:Name="PropertiesPanel"

Grid.Row="1">

<TextBlock

Text="Properties"

FontSize="13.333"

FontWeight="Bold" />

</StackPanel>

<StackPanel

x:Name="TechCharPanel"

Grid.Row="2">

<TextBlock

Text="Technical Characteristics"

FontSize="13.333"

FontWeight="Bold" />

</StackPanel>

<StackPanel

x:Name="NonTechCharPanel"

Grid.Row="3">

<TextBlock

Text="Non-Technical Characteristics"

FontSize="13.333"

FontWeight="Bold" />

</StackPanel>

</Grid>

</DataTemplate>

</toolkit:DataForm.EditTemplate>

</toolkit:DataForm>-->

 

 

 

</DataTemplate>

 

 

 

 

</telerik:RadGridView.RowDetailsTemplate>

 

 

 

 

</telerik:RadGridView>

 

 

 

 

<!--<telerik:RadDataPager

 

Grid.Row="4"

x:Name="PartsDataPager"

Source="{Binding PartItems}"

IsEnabled="{Binding CanLoad}">

</telerik:RadDataPager>-->

 

 

 

<StackPanel

 

 

 

Grid.Row="5"

 

 

 

Orientation="Horizontal"

 

 

 

HorizontalAlignment="Left"

 

 

 

Margin="0,5,0,0">

 

 

 

 

<Button

 

 

 

x:Name="AddNewPartB"

 

 

 

Content="Add New Part"

 

 

 

VerticalAlignment="Top"

 

 

 

Command="{Binding AddNewPart, Mode=OneWay}"

 

 

 

Margin="0,0,0,4" />

 

 

 

 

</StackPanel>

 

 

 

 

<CheckBox

 

 

 

Content="Enable Part Editing Window"

 

 

 

Width="180"

 

 

 

HorizontalAlignment="Left"

 

 

 

IsChecked="{Binding ShowEditingWindow, Mode=TwoWay}"

 

 

 

Grid.Row="6"></CheckBox>

 

 

 

 

<Button

 

 

 

x:Name="SavePartsB"

 

 

 

Content="Save Parts"

 

 

 

HorizontalAlignment="Right"

 

 

 

Width="Auto"

 

 

 

Command="{Binding SaveParts, Mode=OneWay}"

 

 

 

Grid.Row="7" />

 

 

 

 

</Grid>

 

</

 

 

UserControl>

 

[Maya]

Hello Sriman,

I would recommend you to run through our online documentation and demos for a reference. Still, let me know in case you encounter any particular difficulties into converting your DataForm into RadDataForm.
 

Regards,
Maya
the Telerik team