External links in TelerikMenu when using keyboard navigation

Progress® Telerik® UI for Blazor Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Duplicated

Last Updated: 18 May 2026 14:01 by ADMIN

Patrik

Created on: 18 May 2026 08:38

Category: UI for Blazor

Type: Bug Report

External links in TelerikMenu when using keyboard navigation

I have an TelerikMenu with a mix of internal and external links. The menu is using Data binding to a list of menu items. When using the mouse and clicking the external links it works as expected.
However when using the tab to set focus into the menu, then using the arrow keys to navigate to a menu item then hit Enter key, the link opens in the current tab, even if it set to target="_blank".

In this REPL the Enter key does nothing when at Telerik/Documentation and hitting Enter:
https://blazorrepl.telerik.com/mgYflMuM27MjqZrD54

In my case, the URL is opened in the current tab, instead of a new tab.
I'm using ItemTemplade to render the links and my template for external links looks like this:

if (item.IsExternal)
        {
                <ahref="@item.Url"class="@cssClass"target="_blank"rel="noopener noreferrer"
                   @onclick="() => { if (isMobile) CloseMobileMenu(); }"
                   @onclick:stopPropagation="!isMobile">
                    @item.Text
                    <TelerikSvgIconIcon="@SvgIcon.HyperlinkOpen"Size="@ThemeConstants.SvgIcon.Size.Small"Class="@(isMobile ? "ms-2" : "ms-2")"/></a>
        }
 
The rendered HTML looks like this:

    <li data-id="595df6d2-0580-42fd-999d-37f73afedcb6" tabindex="-1" class="k-item k-menu-item " role="menuitem" aria-live="polite"><span class="k-link k-menu-link "><div class="d-flex align-items-center justify-content-between w-100 px-2"><a href="https://theurl.com/an/l/45" class="k-menu-link-text" target="_blank" rel="noopener noreferrer">Go to external page<!--!-->
                    <!--!--><span class="telerik-blazor ms-2 k-icon-sm k-icon k-svg-icon k-svg-i-hyperlink-open" aria-hidden="true"><svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!--><path d="M32 480h448V256h-32v192H64V64h192V32H32zM320 32l56.9 56.9.5.5L224 242.7l45.3 45.3 153.3-153.4L480 192V32z"></path></svg></span></a></div></span></li>
 
                   
                   
I'd rather nog involve js-hacks to solve this issue. Is this a known bug or am i doing it wrong?

Duplicated

This item is a duplicate of an already existing item. You can find the original item here:

Menu Item - flag to open in new tab

1 comment

ADMIN

Dimo

Posted on: 18 May 2026 14:01

Hello Patrik,

The Menu does not navigate on Enter if:

The data item property name is not Url, AND
The Menu UrlField parameter is not set.

In this case, the Menu doesn't know that it needs to navigate at all. Navigation on click occurs due to the ItemTemplate content.

The Menu navigates on Enter in the same browser tab if:

The data item property name is Url, OR
The Menu UrlField parameter is set.

In this case, the Menu knows that it needs to navigate, but doesn't know that it should be in a new browser window / tab. The Menu is not aware of its ItemTemplate content, because Blazor doesn't support programmatic access to RenderFragment content.

This item is related to the feature request Menu Item - flag to open in new tab

Regards,
Dimo
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.