This is a migrated thread and some comments may be shown as answers.

Binding from RadDataForm DataTemplate to DataContext ViewModel

5 Answers 211 Views
DataForm
This is a migrated thread and some comments may be shown as answers.
Michael
Top achievements
Rank 1
Veteran
Iron
Michael asked on 28 Nov 2012, 08:40 AM
Hallo Telerik Team,

I have a problem to bind the SelectedIndex property of a RadTabControl to the ViewModel.

I have a RadTabControl in a RadDataForm and I'm using ReadOnlyTemplate, EditTemplate and NewItemTemplate.
My problem is, that when the user selects a tab in ReadOnlyTemplate to see the data and then press the edit button to edit that data in the selected tab the SelectedIndex of the RadTabControl in the EditTemplate is not the SelectedIndex of the ReadOnlyTemplate.
So the TabControl in the EditTemplate switch back to Default (In my case index 0).
I want that the index of the TabControl will be the same when switching in Edit- or NewItem-mode.

Is there a way to get that to run?

Thx Mike

5 Answers, 1 is accepted

Sort by
0
Maya
Telerik team
answered on 03 Dec 2012, 09:02 AM
Hi Michael,

Generally, you can try binding the index of the selected tab to a property in your ViewModel for example. However, in order to provide more information, I will need a bit more details. Could you specify how you define your data form ? What is the implementation of your ViewModel ?
Basically, any relevant information or code-snippet would be helpful. 

Kind regards,
Maya
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Michael
Top achievements
Rank 1
Veteran
Iron
answered on 03 Dec 2012, 09:21 AM
Hi Maya,

following a code-snippet of my xaml and viewmodel!
the xaml is not complete but it will show you how i would implement the gridview - using the readonlytemplate, edittemplate and newitemtemplate - and the tabcontrols inside the templates.

XAML:
<CoreClientUI:HXWindowPage
    x:Class="Hainzl.Web.Silverlight.Haicmon.Hardware.HardwareForm"
    mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="680" 
     
    xmlns:Intersoft="http://intersoft.clientui.com/schemas"
     
    xmlns:TelerikDataForm="clr-namespace:Telerik.Windows.Controls.Data.DataForm;assembly=Telerik.Windows.Controls.Data"
    xmlns:TelerikGrid="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.GridView"
 
    xmlns:Local="clr-namespace:Hainzl.Web.Silverlight.Haicmon.Hardware"
    xmlns:Core="clr-namespace:Hainzl.Web.Silverlight.Core;assembly=Hainzl.Web.Silverlight.Core"
    xmlns:CoreClientUI="clr-namespace:Hainzl.Web.Silverlight.Core.ClientUIErweiterungen;assembly=Hainzl.Web.Silverlight.Core.ClientUIErweiterungen"
    xmlns:WcfRia="clr-namespace:Hainzl.Web.Server.Haicmon.WCFRIA;assembly=Hainzl.Web.Silverlight.Core"
     
    xmlns:Controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls">
 
    <CoreClientUI:HXWindowPage.DataContext>
        <Local:HardwareViewModel x:Name="xHardwareViewModel" />
    </CoreClientUI:HXWindowPage.DataContext>
     
    <CoreClientUI:HXWindowPage.Resources>
        <Local:ResourceWrapperHardware x:Key="ResourceWrapperHardware"/>
    </CoreClientUI:HXWindowPage.Resources>
 
    <Grid x:Name="LayoutRoot">      
         
        <Telerik:RadTabControl x:Name="xHardwareTabControl" DisplayMemberPath="Content" DropDownDisplayMode="Visible"
                               ScrollMode="Viewport" BorderThickness="0" SelectionChanged="OnCMUTabControl_SelectionChanged"
                               SelectedIndex="{Binding HardwareTabControlSelectedIndex, Mode=TwoWay}"
                               VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
            <Telerik:RadTabItem Header="CMU">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" MinHeight="186" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="415"/>
                    </Grid.RowDefinitions>
 
                    <Telerik:RadGridView x:Name="xCMUDataGrid" Grid.Row="0" RowHeight="25"
                                         CanUserFreezeColumns="False" RowIndicatorVisibility="Collapsed"
                                         IsEnabled="True" IsReadOnly="True"
                                         ItemsSource="{Binding DataView, ElementName=xCMUDataGridDDS}"
                                         IsBusy="{Binding IsBusy, ElementName=xCMUDataGridDDS}"
                                         AutoGeneratingColumn="OnRadGridViewAutoGeneratingColumn"
                                         HorizontalAlignment="Stretch" VerticalContentAlignment="Top"
                                         AutoGenerateColumns="False" RowDetailsVisibilityMode="Visible">
                        <Telerik:RadGridView.Columns>
                            .
                            .
                            .
                            .
                        </Telerik:RadGridView.Columns>
                    </Telerik:RadGridView>
 
                    <Telerik:RadDataPager x:Name="xCMUDataPager"
                                          Grid.Row="1"
                                          Source="{Binding DataView, ElementName=xCMUDataGridDDS}"
                                          DisplayMode="All"
                                          IsTotalItemCountFixed="True"
                                          HorizontalAlignment="Stretch"/>
         
                    <Telerik:RadDataForm x:Name="xCMURadDataForm"
                                         Grid.Row="2" AutoEdit="False"
                                         ItemsSource="{Binding DataView, ElementName=xCMUDataGridDDS}"
                                         AutoGenerateFields="False"
                                         Header="{Binding Source={StaticResource ResourceWrapperCore},
                                                          Path=ApplicationStrings.DetailAnsicht}"
                                         EditEnding="OnCMURadDataForm_EditEnding"
                                         DeletingItem="OnCMURadDataForm_DeletingItem"
                                         ValidatingItem="OnCMURadDataForm_ValidatingItem"
                                         BeginningEdit="OnCMURadDataForm_BeginningEdit"
                                         AddedNewItem="OnCMURadDataForm_AddedNewItem">
             
                        <Telerik:RadDataForm.ReadOnlyTemplate>
                            <DataTemplate>
                                <Telerik:RadTabControl x:Name="xCMUTabControl" VerticalAlignment="Top" Grid.Row="0"
                                                       DisplayMemberPath="Content" DropDownDisplayMode="Visible" Height="318"
                                                       ScrollMode="Viewport" BorderThickness="0">
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperCore},
                                                                                  Path=ApplicationStrings.Allgemein}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperCore},
                                                                         Path=ApplicationStrings.Allgemein}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                                  Path=ApplicationStrings.NetzwerkEinstellungen}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                         Path=ApplicationStrings.NetzwerkEinstellungen}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                                  Path=ApplicationStrings.Module}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                         Path=ApplicationStrings.Module}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
                                </Telerik:RadTabControl>
                            </DataTemplate>
                        </Telerik:RadDataForm.ReadOnlyTemplate>
                        <Telerik:RadDataForm.EditTemplate>
                            <DataTemplate>
                                <Telerik:RadTabControl x:Name="xCMUTabControl" VerticalAlignment="Top" Grid.Row="0"
                                                       DisplayMemberPath="Content" DropDownDisplayMode="Visible" Height="303"
                                                       ScrollMode="Viewport" BorderThickness="0" SelectionChanged="OnCMUTabControl_SelectionChanged"
                                                       SelectedIndex="{Binding CMUTabControlSelectedIndex, Mode=TwoWay}">
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperCore},
                                                                                  Path=ApplicationStrings.Allgemein}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperCore},
                                                                         Path=ApplicationStrings.Allgemein}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                                  Path=ApplicationStrings.NetzwerkEinstellungen}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                         Path=ApplicationStrings.NetzwerkEinstellungen}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                                  Path=ApplicationStrings.Module}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                         Path=ApplicationStrings.Module}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                </Telerik:RadTabControl>
                            </DataTemplate>
                        </Telerik:RadDataForm.EditTemplate>
                        <Telerik:RadDataForm.NewItemTemplate>
                            <DataTemplate>
                                <Telerik:RadTabControl x:Name="xCMUTabControl" VerticalAlignment="Top" Grid.Row="0"
                                                       DisplayMemberPath="Content" DropDownDisplayMode="Visible" Height="318"
                                                       ScrollMode="Viewport" BorderThickness="0">
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperCore},
                                                                                  Path=ApplicationStrings.Allgemein}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperCore},
                                                                         Path=ApplicationStrings.Allgemein}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                                  Path=ApplicationStrings.NetzwerkEinstellungen}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                         Path=ApplicationStrings.NetzwerkEinstellungen}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                    <Telerik:RadTabItem DropDownContent="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                                  Path=ApplicationStrings.Module}"
                                                        Header="{Binding Source={StaticResource ResourceWrapperHardware},
                                                                         Path=ApplicationStrings.Module}"
                                                        Padding="10 2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                        <Telerik:RadTabItem.Content>
                                            .
                                            .
                                            .
                                        </Telerik:RadTabItem.Content>
                                    </Telerik:RadTabItem>
 
                                </Telerik:RadTabControl>
                            </DataTemplate>
                        </Telerik:RadDataForm.NewItemTemplate>
                    </Telerik:RadDataForm>
                </Grid>
            </Telerik:RadTabItem>
        </Telerik:RadTabControl>
    </Grid>
</CoreClientUI:HXWindowPage>


ViewModel:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Globalization;
using System.Collections.Specialized;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows;
 
using Telerik.Windows.Controls;
 
using Hainzl.Web.Silverlight.Core;
using Hainzl.Web.Silverlight.Core.TelerikErweiterungen;
 
namespace Hainzl.Web.Silverlight.Haicmon.Hardware
{
    public class HardwareViewModel : HaicmonViewModelBase
    {
        /// <summary>
        /// Erstellt eine Instanz.
        /// </summary>
        public HardwareViewModel()
        {
            this.CMUTabControlSelectedIndex = 0;
        }
 
        /// <summary>
        /// Privates Feld für die HardwareTabControlSelectedIndex Eigenschaft.
        /// </summary>
        private int _HardwareTabControlSelectedIndex;
 
        /// <summary>
        /// Gibt den zuletzt aktiven Index des HardwareTabControl zurück oder stellt diesen ein.
        /// </summary>
        public int HardwareTabControlSelectedIndex
        {
            get
            {
                return this._HardwareTabControlSelectedIndex;
            }
            set
            {
                if (this._HardwareTabControlSelectedIndex != value)
                {
                    this._HardwareTabControlSelectedIndex = value;
                    this.OnNotifyPropertyChanged("HardwareTabControlSelectedIndex");
                }
            }
        }
 
        /// <summary>
        /// Privates Feld für die CMUTabControlSelectedIndex Eigenschaft.
        /// </summary>
        private int _CMUTabControlSelectedIndex;
 
        /// <summary>
        /// Gibt den zuletzt aktiven Index des CMUTabControl zurück oder stellt diesen ein.
        /// </summary>
        public int CMUTabControlSelectedIndex
        {
            get {
                return this._CMUTabControlSelectedIndex;
            }
            set
            {
                if (this._CMUTabControlSelectedIndex != value)
                {
                    this._CMUTabControlSelectedIndex = value;
                    this.OnNotifyPropertyChanged("CMUTabControlSelectedIndex");
                }
            }
        }
 
        /// <summary>
        /// Private Variable für die Eigenschaft IsBusy.
        /// </summary>
        private bool _IsBusy;
 
        /// <summary>
        /// Gibt den Status für IsBusy (True,False) zurück oder stellt diesen ein.
        /// </summary>
        public bool IsBusy
        {
            get { return this._IsBusy; }
            set
            {
                if (this._IsBusy != value)
                {
                    this._IsBusy = value;
                    this.OnNotifyPropertyChanged("IsBusy");
                }
            }
        }
 
    }
}


I hope this help you to solve my problem.

Thx Mike





0
Michael
Top achievements
Rank 1
Veteran
Iron
answered on 04 Dec 2012, 08:37 AM
Any chance to get fix this?
0
Accepted
Maya
Telerik team
answered on 06 Dec 2012, 09:21 AM
Hi Michael,

I have tried to reproduce the behavior you described, but without any success. Could you take a look at the sample attached to verify whether it covers the same scenario ? Could you get the same behavior on it ? 

All the best,
Maya
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Michael
Top achievements
Rank 1
Veteran
Iron
answered on 06 Dec 2012, 10:01 AM
Hi Maya,

big thx for the sample project.

this behavior works for me!

best
mike
Tags
DataForm
Asked by
Michael
Top achievements
Rank 1
Veteran
Iron
Answers by
Maya
Telerik team
Michael
Top achievements
Rank 1
Veteran
Iron
Share this question
or