How do I get a reference to the currently selected tab in a Kendo UI TabStrip?

Question

I'm creating a method to delete a Kendo UI TabStrip Tab based on an 'x' image. I want it to work in the same way as other tab controls (such as Chrome/IE):

• If the active tab is closed then select the next tab (or if it's the last tab then select previous tab).
• If it's not an active tab then ensure the active tab remains open.

I believe I need to get a reference to the current tab, then check if the tab being deleted is the active tab.

My code at the moment simply closes the tab in relation to the clicked image:

function DeleteTab(imgObj) {

        var tabStrip = $("#tabstrip").data("kendoTabStrip");

        var deleteIndex = $(imgObj).closest("li").index();
        tabStrip.remove(deleteIndex);
}

How do I get a reference to the currently selected tab? Can I do this by searching for k-state-active?

Answer 1

tabstrip.select() will return the currently selected tab.

Answer 2

tabStrip.select().index();

Will return currently selected tab index

Answer 3

To get the currently selected tab of the tabstrip, you can use:

var selectedTabElem = $("#tabstripElemId").data('kendoTabStrip').select();// this will be the <li> element that is currently selected

Then one can access the current tab text as below:

var currentSelectedTabText = $(selectedTabElem).children(".k-link").text();