insertBefore

Inserts a newly-created tab before a specified tab.

Example

<div id="tabstrip">
    <ul>
        <li>Tab</li>
    </ul>
    <div>Content</div>
</div>

<script>
    var tabStrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
    tabStrip.insertBefore(
        [{
            text: "Item 1",
            url: "https://www.telerik.com"               // Link URL if navigation is needed, optional.
        },
        {
            text: "<b>Item 2</b>",
            encoded: false,                             // Allows use of HTML for item text
            content: "text"                             // Content for the content element
        },
        {
            text: "Item 3",
            contentUrl: "https://demos.telerik.com/kendo-ui/content/web/tabstrip/ajax/ajaxContent1.html"
        },
        {
            text: "Item 4",
            imageUrl: "https://demos.telerik.com/kendo-ui/content/shared/icons/sports/baseball.png",
        },
        {
            text: "Item 5",
            spriteCssClass: "imageClass3"               // Item image sprite CSS class, optional.
        }],
        tabStrip.tabGroup.children().eq(0)
    );
</script>

Parameters

item Array|Object|String|Element|jQuery

Target tab(s), specified as a JSON object or array of objects. You can pass tab text, content or contentUrl here. Accepts also existing tab(s) specified as a string selector or jQuery object or DOM elements.

referenceTab String|Element|jQuery

A reference tab to insert the new item before

Returns

kendo.ui.TabStrip Returns the TabStrip object to support chaining.

In this article