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

Setting focus to a datatemple textbox

2 Answers 73 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Patricia
Top achievements
Rank 1
Patricia asked on 12 Jan 2012, 11:38 PM
I have a grid view that uses a datatemple for each row to edit data.  when I add a new row I want the cursor to be focused in the textbox in the datatemplate on the row details.  Nothing seems to work.  I have to tab to get to the textbox.  
<Window x:Class="GridviewDataTemplateFocusExample.MainWindow"
                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:GridviewDataTemplateFocusExample="clr-namespace:GridviewDataTemplateFocusExample" Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <DataTemplate x:Key="DetailView" >
            <GridviewDataTemplateFocusExample:DetailView />
        </DataTemplate>
    </Window.Resources>
        <Grid>
        <telerik:RadGridView HorizontalAlignment="Stretch"  Name="radGridView1" VerticalAlignment="Stretch"
                             ItemsSource="{Binding MyData}"
                             AutoGenerateColumns="False"
                             CanUserInsertRows="True"
                             RowIndicatorVisibility="Collapsed"
                             CanUserDeleteRows="False"
                             ShowInsertRow="True"
                             ShowGroupPanel="False"
                             IsSynchronizedWithCurrentItem="True"
                             AddingNewDataItem="radGridView1_AddingNewDataItem"
                             LoadingRowDetails="radGridView1_LoadingRowDetails"
                             RowDetailsVisibilityMode="Collapsed"
                             RowDetailsTemplate="{StaticResource DetailView}" >
            <telerik:RadGridView.Columns>
                <telerik:GridViewToggleRowDetailsColumn/>
                <telerik:GridViewDataColumn Header="Title" Width="250" DataMemberBinding="{Binding Name}" UniqueName="TitleColumn"/>
            </telerik:RadGridView.Columns>
 
        </telerik:RadGridView>
    </Grid>
</Window>

using System;
using System.Windows;
using System.Windows.Input;
using Telerik.Windows.Controls.GridView;
 
namespace GridviewDataTemplateFocusExample
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            this.DataContext = new MainWindowVM();
            InitializeComponent();
        }
 
        private void radGridView1_AddingNewDataItem(object sender, Telerik.Windows.Controls.GridView.GridViewAddingNewEventArgs e)
        {
            (this.DataContext as MainWindowVM).AddNewDataObject();
            radGridView1.CommitEdit();
            var gridView = e.OwnerGridViewItemsControl;
            gridView.ScrollIntoViewAsync(gridView.Items[gridView.Items.Count - 1], //the row
                        gridView.Columns[1], //the column
                        new Action<FrameworkElement>((f) =>
                        {
                            var row = f as GridViewRow;
                            if (row != null)
                            {
                                row.IsSelected = true;
                                row.DetailsVisibility = Visibility.Visible;
                            }
                        }));
            e.Cancel = true;
        }
 
        private void radGridView1_LoadingRowDetails(object sender, Telerik.Windows.Controls.GridView.GridViewRowDetailsEventArgs e)
        {
            Keyboard.Focus((e.DetailsElement as DetailView).tbxTitle);
 
        }
    }
}

using System.Collections.ObjectModel;
 
namespace GridviewDataTemplateFocusExample
{
    public class MainWindowVM
    {
        public ObservableCollection<DataObject> MyData { get; set; }
 
        public MainWindowVM()
        {
            MyData = new ObservableCollection<DataObject>();
            MyData.Add(new DataObject("Test 1"));
            MyData.Add(new DataObject("Test 2"));
            MyData.Add(new DataObject("Test 3"));
            MyData.Add(new DataObject("Test 4"));
            MyData.Add(new DataObject("Test 5"));
        }
 
        public void AddNewDataObject()
        {
            MyData.Add(new DataObject("Test ??????"));
        }
    }
 
    public class DataObject
    {
        public DataObject(string name)
        {
            Name = name;
        }
        public string Name { get; set; }
    }
}

<UserControl x:Class="GridviewDataTemplateFocusExample.DetailView"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" mc:Ignorable="d"
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <Grid FocusManager.FocusedElement="{Binding ElementName=tbxTitle}"  FocusManager.IsFocusScope="True">
            <Border BorderThickness="2" Margin="3" BorderBrush="Black" CornerRadius="12" Padding="5" Background="Transparent" HorizontalAlignment="Stretch" >
                <telerik:RadTabControl Margin="2"  BackgroundVisibility="Hidden" HorizontalAlignment="Stretch" >
                    <telerik:RadTabItem Header="Details"  >
                        <Grid Width="Auto" HorizontalAlignment="Stretch" Background="Transparent" Margin="5" >
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
 
                            <TextBlock Text="Name: " Margin="0,5,0,5" FontWeight="Bold" Grid.Row="0" Grid.Column="0" VerticalAlignment="Center" HorizontalAlignment="Left"  Focusable="False"/>
                            <TextBox Name="tbxTitle" Text="{Binding Name}" Margin="0,5,0,5" Grid.Row="0" Grid.Column="1" 
                                 VerticalAlignment="Center" HorizontalAlignment="Stretch"  Focusable="true"
 
                                 />
 
                        </Grid>
                    </telerik:RadTabItem>
                    <telerik:RadTabItem Header="Page 2" >
  
                    </telerik:RadTabItem>
                    <telerik:RadTabItem Header="Page 3" >
                     </telerik:RadTabItem>
 
                </telerik:RadTabControl>
            </Border>
        </Grid>
    </Grid>
</UserControl>

2 Answers, 1 is accepted

Sort by
0
Maya
Telerik team
answered on 13 Jan 2012, 07:57 AM
Hello Patricia,

Indeed, on loading the row details the visual elements inside might not yet been created. You can try to handle directly Loaded event of the required TextBox and focus it inside. Thus you will be sure that this visual element is visualized and available:
 

private void tbxTitle_Loaded(object sender, RoutedEventArgs e)
        {          
            (sender as TextBox).Focus();
        }



Kind regards,
Maya
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Patricia
Top achievements
Rank 1
answered on 16 Jan 2012, 02:48 PM
That did not work. 

Tags
GridView
Asked by
Patricia
Top achievements
Rank 1
Answers by
Maya
Telerik team
Patricia
Top achievements
Rank 1
Share this question
or