I am aware that it is possible to set up an event that fires whenever the tab is changed within a tab strip within Kendo UI. However, I'm wondering if it is possible to fire separate events on separate tabs?
For example, I have a tab strip with 6 tabs. I want to fire a different event on entering tab 2 than when entering tab 4 or 5 or 6. I want a separate event for each tab. How can I tell Kendo UI to listen in for which tab we are on to fire these distinct events?
Please show what you have tried, So it will help us to find the exact problem/solution.
Anyways, You can use active
Event handler in TabStrip
.
Set an id
for the tab, And check the id
and call the function
, when user activate it.
For more info Documentation
This is very simple example
<div id="tabStrip">
<ul>
<li id='tab1'>Tab 1</li>
<li id='tab2'>Tab 2</li>
</ul>
<div>Content 1</div>
<div>Content 2</div>
</div>
<script>
// event handler for activate
var onActivate = function(e) {
// access the activated item via e.item (Element)
if(e.item.id == "tab1"){
alert("func 1");
} else if (e.item.id == 'tab2') {
alert("func 2");
}
};
// attach activate event handler during initialization
var tabStrip = $("#tabStrip").kendoTabStrip({
activate: onActivate
}).data("kendoTabStrip");
</script>