This is a migrated thread and some comments may be shown as answers.
Updating Kendo TabStrip Item's Text dynamically
1 Answer 71 Views
This is a migrated thread and some comments may be shown as answers.
Amy
Top achievements
Rank 1
Amy asked on 05 Jun 2018, 10:04 PM

Hello all,

I would like to append the badge count of number of records (retrieved in the grid that appears when a Kendo TabStrip Item is selected) to the TabStrip Item's Text. So basically this is something like changing the TabStrip Item's Text dynamically. It would be really helpful if someone could suggest any ideas on how to achieve this. Thank you in advance!! 

1 Answer, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 08 Jun 2018, 09:45 AM
Hello Amy,

I would suggest subscribing to the TabStrip's select event. Then, in the event handler simply query the event item object to find the .k-link <span> element and use jQuery's text() method to modify its content:
<script>
  var tabstrip = $("#tabstrip").kendoTabStrip({
    select: function(e) {
      var itemTextElement = $(e.item).find(".k-link");
             
      itemTextElement.text("My Custom Text");
    }
  }).data("kendoTabStrip");
</script>

The above is also demonstrated on the following Dojo example. You can test it by clicking on the first tab - notice that the tab's text is changed. 

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Asked by
Amy
Top achievements
Rank 1
Answers by
Dimitar
Telerik team
Share this question
or