Bug report

The TabStrip Item Action() method is not loading content correctly.

Reproduction of the problem

1. The configuration of the TabStrip, including the Action method:
   @(Html.Kendo().TabStrip() .Name("tabs") .Items(strip => { strip.Add().Text("Back").Action("About", "Home"); // ...
2. Click on the tab.

Current behavior

For kendo.version '2024.3.806', when the tab is clicked, the controller method does not load from the Action().

Expected/desired behavior

For previous versions, like '2023.2.718', when the tab is clicked, the URL from the action method is loaded into the browser URL.

Environment

• Telerik UI for ASP.NET version: 2024.3.806
• Browser: [all ]

Describe the bug
Scenario: a Window appended to the content of a TabStrip tab. If the content is scrolled down, when you open the Window it does not appear centered. Reproducible only with the SASS themes.

To reproduce
Steps to reproduce the behavior:

1. Go to this dojo example: https://dojo.telerik.com/unopUDaQ/7
2. Follow the instructions in tab 1: scroll down to the bottom of the tab's content and click the button.
3. The Window shows up, but it is not centered. In Chrome the tab's content is automatically scrolled up a little bit.
4. On dragging the Window, the mouse cursor is offset from the title.

Expected behavior
The behavior with the LESS themes is the expected one. The Window appears centered and there is no offset when dragging it.

Affected package (please remove the unneeded items)

• theme-default
• theme-bootstrap
• theme-material

Affected suites (please remove the unneeded items)

• Kendo UI for jQuery

Affected browsers (please remove the unneeded items)

• All

Build system information (please remove the unneeded items)

• Not Applicable

Add an option to use template items in the TabStrip, similar to the ones available in the ToolBar component:

items.Add().Template("<label for='dropdown'>Format:</label>");
This would allow using Html and components in the TabStrip's header. 

Adding checkbox along with tabname would be good feature

When working with a dynamically setup of the tabstrip, and hiding/showing tabs according to the data entered in a form, I use jquery scripts to do the logical setup.

Each tab is referenced in the script by their array position:

var tbs = $("#tabstripDetail").data("kendoTabStrip");
$(tbs.items()[0]).hide();

$(tbs.items()[4]).show();

tbs.select(4);

For some functions I move/duplicate field from models according to the different customers needs, and to avoid several fields on the form with the same id/name I remove tabs from the collection.

tbs.remove(4);

By doing this the array of tabs are changed, and I have to keep track of which array number each tab has compared to the initial number.

My suggestion is that each tab could be named so that it is possible to keep references of the tabs by logical names and avoid array numbers.

tbs.remove("maritimeProducts");

This functionality will simplify working with show, hide, remove, select of single tabs.

 

 

Bug report

Reported in Ticket ID: 1472894.

Reproduction of the problem

Reproducible in this demo.

Current behavior

The content of the tab is not focusable.

Expected/desired behavior

The tabs themselves and the active tab's content should be focusable: https://www.w3.org/TR/wai-aria-practices/examples/tabs/tabs-1/tabs.html

Environment

• Kendo UI version: 2020.2.617
• jQuery version: x.y
• Browser: [all ]

It will be very useful functionality to be able to change a tab title with a double click on it - the same as when one double-click on an Excel spreadsheet.