How to make grid edit functionality working with tab click

[Kunal]

Hi

We are having a grid with editable field option which triggers when you click on the field.

I wanted to enable tab functionality so that if you are on any field and click tab it should make the next field enable/editable.

When I am clicking on any field to show like this. On tab press I wanted make Charlotte editable.

ANY help appreciated. Thanks!

[Aleksandar]

Hello Kunal,

This would be the default behavior of a Grid with InCell editing and navigation enabled. In the Batch Editing Demo for the Grid keyboard navigation is enabled and when a cell enters edit mode an the user presses the Tab key navigation to the next cell will occur and it will enter edit mode, as you can see in this screencast.

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
    .Name("Grid")
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Navigatable()
    //additional configuration options
)

For available keyboard shortcuts you can refer to the Keyboard Navigation Demo and the section below it, where the available key combinations are listed.

If that's not helpful consider sharing the Grid definition you have and the version of Telerik UI for ASP.NET Core used. Providing a runnable example, or a REPL example, would be helpful in providing a better suggestion on handling the case.

Regards,
Aleksandar
Progress Telerik

[Kunal]

Thanks Aleksandar this is what I have been looking for.