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

RAD GRID cell selection Tab KEY or Right Arrow KEY

11 Answers 448 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Syed
Top achievements
Rank 1
Syed asked on 12 Dec 2013, 07:23 AM
Hi,
How can i achive Tab or Right Key press and change the selected grid cell to next Cell.
For example i have 10 Column and 10 rows in a grid.
IF i click on first row cell of Colum[0] and press Tab Key or Right Arrow Key the selected cell should move to next cell .Same like Excel

11 Answers, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 17 Dec 2013, 09:16 AM
Hi Syed,

You can enable the keyboard navigation of RadGrid to achieve the requested functionality:
http://www.telerik.com/help/aspnet-ajax/grid-keyboard-support.html

Hope this helps.

Regards,
Eyup
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
jsearl
Top achievements
Rank 1
answered on 29 Jan 2014, 06:43 PM
I have a similar question, but in my case I'm using a RadGrid with batch editing enabled and with Keyboard Navigation.  Tabbing between fields works great, but the problem is when I Tab into a GridTemplateColumn with a DropDownList and a Button I cannot use the Tab key to tab to the button.  It just goes directly to the next column.  Is there a way to do both, meaning I still want to be able to Tab to the next column and use Tab to place focus on the button?  Thanks!
0
Eyup
Telerik team
answered on 03 Feb 2014, 11:33 AM
Hi Jeremy,

Can you please send us sample screenshots or video demonstrating the desired behavior? Thus, we will be able to figure out your specific scenario and suggest a proper approach.

Regards,
Eyup
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
0
jsearl
Top achievements
Rank 1
answered on 03 Feb 2014, 04:08 PM
In the attached images you will see a RadGrid with batch editing and keyboard navigation enabled.  The first image shows that the batch edit mode is set to row editing and Tabbing between fields is working. 

The second image shows what happens when the Tab key is pressed to move to the last column, which is a GridTemplateColumn with just a RadDropDownList and a button in it.  Notice that the RadDropDownList receives focus initially.

The third image shows what happens when the Tab key is pressed again.  Here we would like the Tab key to tab over to the button inside the same column, but instead, the focus is transferred to the first column of the next row.  I would like to be able to have the Tab key set focus on the button as well instead of skipping over it.  I hope this is more clear.
0
Eyup
Telerik team
answered on 06 Feb 2014, 01:41 PM
Hello Jeremy,

This issue should be fixed in the latest internal build of the controls. Until the next actual release version, please try out the latest internal one and let us know about the result.

Regards,
Eyup
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
0
jsearl
Top achievements
Rank 1
answered on 07 Feb 2014, 07:05 PM
Eyup,

Thanks for your reply.  I tried the latest internal build (trial version) and it does, in fact, fix the issue.  The problem is I need the fix now.  Is there a workaround I can try, or a production version of the internal build?

Thanks!
0
Eyup
Telerik team
answered on 12 Feb 2014, 12:40 PM
Hi Jeremy,

I have forwarded your query to our developers and the response I got was quite interesting. They replied that passing the focus to the next cell on Tab key press regardless of the current focused control is expected and this is the exact way Batch keyboard navigation should work.

As for the scenario we are involved with, it is caused by the DropDownList and currently it works correctly - the button should be ignored when Tab is pressed and the focus should pass to the next row.

Nevertheless, you can try the following approach to achieve the requested custom functionality:
<telerik:RadDropDownList ID="RadDropDownList1" runat="server" onkeydown="dropDownKeyDown(event);">
    <Items>
        <telerik:DropDownListItem Text="1" />
        <telerik:DropDownListItem Text="2" />
        <telerik:DropDownListItem Text="3" />
    </Items>
</telerik:RadDropDownList>
JavaScript:
function dropDownKeyDown(event) {
    if (event.keyCode == 9) {
        event.stopPropagation();
    }
}

I hope the clarification was helpful. Sorry for the initial confusion.

Regards,
Eyup
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
0
jsearl
Top achievements
Rank 1
answered on 12 Feb 2014, 09:50 PM
Eyup,

This is exactly what I was looking for.  This code in combination with the new Q3 2013 SP DLLs did the trick.  Thanks!
0
Eyup
Telerik team
answered on 13 Feb 2014, 07:16 AM
Hello Jeremy,

I'm glad that the suggested approach was helpful. However, please bear in mind that this is not the default behavior and different versions of the UI controls may deactivate this workaround.

Regards,
Eyup
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
0
Kabir
Top achievements
Rank 1
answered on 05 Nov 2015, 12:02 PM

I am experiencing something similar. Wondering if you can provide assistance. I am using the RadGrid with Batch Edit set to true, edit type = cell.

If I am in a cell with a textbox, and I press tab, I am taking to the next cell (expected). However, if that cell contains a rad drop down list, when I press tab, I don't go to the next cell, instead the drop down loses focus, and then the 'Save' (first command button) button in the footer is focused. I can then tab to the rest of the command buttons, and then out of the grid. But I want to tab to the next cell.

0
Kostadin
Telerik team
answered on 10 Nov 2015, 11:40 AM
Hello Kabir,

I test the behaviour in the following live example which contains a RadDropDown. As you can see when you press the tab key the focus goes to the next cell. I am not sure which control and settings you have enabled but you can use a similar approach as the one provided in the example.

Regards,
Kostadin
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Grid
Asked by
Syed
Top achievements
Rank 1
Answers by
Eyup
Telerik team
jsearl
Top achievements
Rank 1
Kabir
Top achievements
Rank 1
Kostadin
Telerik team
Share this question
or