Completed
Last Updated: 11 Nov 2024 15:08 by ADMIN
eDAD
Created on: 04 Sep 2022 09:08
Category: UI for ASP.NET AJAX
Type: Bug Report
0
Focus moves on non-interactive table controls.

Test Environment:

OS: Windows_11

Version: 22H2
OS Build: 22598.200
Browser: Version 104.0.1293.70 (Official Build) (64-bit)
  1. Open URL: https://demos.telerik.com/aspnet-ajax/grid/examples/overview/defaultcs.aspx   page in Edge Browser.
  2. TAB to the grid container.
  3. Observe the issue that the grid container is receiving focus.

Actual Behavior:

Focus moves on non-interactive controls.

Expected Behavior:

Focus shouldn't go to the non-interactive element in table content.

3 comments
ADMIN
Rumen
Posted on: 30 May 2023 08:35

Hi,

You can hide the border outline using the following CSS class:

<style>
    .RadGrid:focus {
        outline: none;
    }
</style>

or you can programmatically remove the tabindex="0" attribute from the Grid div wrapper element with this code:

<script>
    function OnClientLoad(grid, args) {
        if (grid.get_element().getAttribute("tabindex") == "0")
            grid.get_element().removeAttribute("tabindex");
    }
</script>
<telerik:RadGrid ClientSettings-ClientEvents-OnGridCreated="OnClientLoad" ID="RadGrid1" ...

Of course, if you have any suggestions on improving this behavior they are very welcome.

 

Regards,
Rumen
Progress Telerik

Heads up! Telerik UI for ASP.NET AJAX versions for .NET 3.5 and 4.0 are retired. Progress will continue shipping assemblies compatible with .NET 4.5 and later. See whether this affects your apps in this article.
eDAD
Posted on: 23 May 2023 11:09

Adding latest behavior as a video proof and please find attachment.

Focus is moving on the non-interactive container.

ADMIN
Peter Milchev
Posted on: 09 Sep 2022 12:11

Hello,

Could you please specify which controls that get the focus are non-interactive? The headers of the grid are interactive and if you press Enter while they have focus, you would trigger the sorting for the column.

Regards,
Peter Milchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.