[Solved] Focus invisible column when EnableColumnVirtualization is On

[Ludovic Gerbault]

I think I have a bug, or at least a wrong way to do it.

I have a small grid with both column and row virtualization. This Grid has 5 columns (2 GridViewComboBoxColumn and 1 GridViewDataColumn)

By default, I can only see the first 3 columns, and scroll to the last two, no probem there.

I also implemented a way to programmatically navigate inside a row using the tab key, and when I hit tab on the last visible column to go to the next one, the browser crash.

I think it might be linked to the columnvirtualization mechanism.

If I disable it, the grid navigation works then as expected.

Here's the code that navigates in a row using the tab key :

void KeyDownTabAction()
        {
            var element = (GridViewRow)this.FormGrille.CurrentCell.ParentRow;
            var cellIndex = element.Cells.IndexOf(FormGrille.CurrentCell);

            if (cellIndex > element.Cells.Count - 1)
            {
                this.btn_new.Focus();
            }
            else
            {
                if (((GridViewCell)element.Cells[cellIndex]).IsEnabled == true)
                {
                    ((GridViewCell)element.Cells[cellIndex]).IsCurrent = true;
                    FormGrille.BeginEdit();
                }
                else
                {
                    this.btn_new.Focus();
                }
            }
        }

Regards

Ludovic

[Nedyalko Nikolov]

Hello Ludovic,

I've tried to simulate your issue, unfortunately to no avail. Can you provide me with more info how you handle KeyDown event (a sample project which I can debug on my side will be great)?

Kind regards,
Nedyalko Nikolov
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.

[Ludovic Gerbault]

Well, unfortunatly, I can't provide a sample project right now, because of a lack of time, but I will give as much details and code samples as I can to help you reproduce the issue.


So, first, I have a radwindow, Height 600px, Width 800px.

This window is shown in modal mode, and contains a grid generated in code behind containing differents form elements such as RadComboBox, TextBox, TextBlocks, checkbox...

If a certain parameter is retreive, it will show a RadGridView inside this RadWindow like this

if (afficherGrille)
                    {
                        RowDefinition rowDef2 = new RowDefinition();
                        rowDef2.Height = new GridLength(200);

                        content.RowDefinitions.Add(rowDef2);
                        FormGrid grille2 = new FormGrid(id_societe, id_categorie, id_contact, 0, ((RadTabItem)tabForm.Items[i]).Header.ToString(), _wsPartenaire);
                        Grid.SetColumnSpan(grille2, 2);
                        Grid.SetRow(grille2, content.RowDefinitions.Count - 1);
                        content.Children.Add(grille2);
                    }

The xaml for the UserControl FormGrille is very simple, since all the logic is handle in the code behind

<UserControl xmlns:telerikInput="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input"  x:Class="T2J_Application.FormGrid"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:telerikGrid="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.GridView">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="70" />
        </Grid.ColumnDefinitions>

        <telerikGrid:RadGridView Grid.Column="0"
                                 Width="Auto"
                                 Height="200"
                                 x:Name="FormGrille"
                                 CanUserResizeColumns="False"
                                 CanUserInsertRows="True"
                                 CanUserDeleteRows="True"
                                 ShowGroupPanel="False"
                                 AutoGenerateColumns="False"
                                 CanUserReorderColumns="False"
                                 CanUserSortColumns="False"
                                 EnableColumnVirtualization="True"
                                 ScrollViewer.HorizontalScrollBarVisibility="Disabled" />

        <Button x:Name="btn_new" Width="70" Height="50" Content="Ajouter" Click="Button_Click" Grid.Column="1" VerticalAlignment="Top" />
    </Grid>
</UserControl>

The code behind creates 5 column, but the radwindow can only show 3 of them.

Here's the code that handles the Key Event :

 void cell_KeyDown(object sender, KeyEventArgs e)
        {
            if (e.Key == Key.Enter)
            {
                Dispatcher.BeginInvoke(new Action(this.KeyDownAction));
            }
            if (e.Key == Key.Tab)
            {
                Dispatcher.BeginInvoke(new Action(this.KeyDownTabAction));
            }
        }

        void KeyDownAction()
        {
            var element = (GridViewRow)this.FormGrille.CurrentCell.ParentRow;
            var cellIndex = element.Cells.IndexOf(FormGrille.CurrentCell);

            if (cellIndex + 1 > element.Cells.Count - 1)
            {
                this.btn_new.Focus();
            }
            else
            {
                if (((GridViewCell)element.Cells[cellIndex + 1]).IsEnabled == true)
                {
                    ((GridViewCell)element.Cells[cellIndex + 1]).IsCurrent = true;
                    FormGrille.BeginEdit();
                }
                else
                {
                    this.btn_new.Focus();
                }
            }
        }

        void KeyDownTabAction()
        {
            var element = (GridViewRow)this.FormGrille.CurrentCell.ParentRow;
            var cellIndex = element.Cells.IndexOf(FormGrille.CurrentCell);

            if (cellIndex > element.Cells.Count - 1)
            {
                this.btn_new.Focus();
            }
            else
            {
                if (((GridViewCell)element.Cells[cellIndex]).IsEnabled == true)
                {
                    ((GridViewCell)element.Cells[cellIndex]).IsCurrent = true;
                    FormGrille.BeginEdit();
                }
                else
                {
                    this.btn_new.Focus();
                }
            }
        }

There you go, don't hesistate to ask any more details.

And as I was saying, as long as EnableColumnVirtualization is enabled, the browser will crash if I try to Tab into an invisible column.
If it is disabled, everything works fine.

[Nedyalko Nikolov]

Hello Subileau Pascal,

I'm attaching my test application, since I cannot reproduce the issue. Please take a look at the example and let me know what I'm doing wrong or how to simulate the problem.

Regards,
Nedyalko Nikolov
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.