Kendo UI TabStrip - Selecting a tab by it's Text

15,043

Solution 1

Basically you need to find the li.k-item and pass it to the select method. Here comes the jQuery:

var ts = $('#tabstrip').data().kendoTabStrip;
var item = ts.tabGroup.find(':contains("What you look for")');
ts.select(item);

Solution 2

$(document).ready(function(){
      $j("#tabstrip").kendoTabStrip( {
          animation:    {
              open: {
                  effects: "fadein"
              }
          },
    select: function(element){selecttab(element)}           
      });
function selecttab(element) {
        var tabStrip1 = $('#tabstrip').kendoTabStrip().data("kendoTabStrip");
        tabStrip1.select("li:contains(" + $(element.item).text()+ ")");

}            

Solution 3

i tried this - just plain jquery, seems to be working for now in chrome...

var selectedTabName = $("li[aria-selected='true']").text();

Share:
15,043
Ian Vink
Author by

Ian Vink

https://mvp.microsoft.com/en-us/PublicProfile/5002789?fullName=Ian%20Vink

Updated on June 24, 2022

Comments

  • Ian Vink
    Ian Vink about 2 years

    I am trying to select a tab in javascript when I only know the Text of the tab

    I know to get the Selected Tab I do this:

    var tabStrip = $("#tabMain").data("kendoTabStrip");
    var tab = tabStrip.select();
    

    How do I cause the Selected Tab to be the one with the text "MyTitle"

    Note: I create the Tab with MVC 4

        @(Html.Kendo().TabStrip()
              .Name("tabMain")
              .Items(items =>
                  {
                      items.Add().Text("MyTitle")