activate

Triggered after a tab is being made visible and its animation complete. Before Q2 2014 this event was invoked after tab show, but before the end of the animation. This event is triggered only for tabs with associated content.

Event Data

e.item Element

The activated tab.

e.contentElement Element

The content element of the activated tab.

Attach activate event handler during initialization; detach via unbind()

<div id="tabStrip">
    <ul>
        <li>Tab 1</li>
        <li>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)

        // detach activate event handler via unbind()
        tabStrip.unbind("activate", onActivate);
    };

    // attach activate event handler during initialization
    var tabStrip = $("#tabStrip").kendoTabStrip({
        activate: onActivate
    }).data("kendoTabStrip");
</script>

Attach activate event handler via bind(); detach via unbind()

<div id="tabStrip">
    <ul>
        <li>Tab 1</li>
        <li>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)

        // detach activate event handler via unbind()
        tabStrip.unbind("activate", onActivate);
    };

    // attach activate event handler via bind()
    var tabStrip = $("#tabStrip").kendoTabStrip().data("kendoTabStrip");
    tabStrip.bind("activate", onActivate);
</script>