Kendo UI

PanelBar get index

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.blueopal.min.css">
<script src="http://cdn.kendostatic.com/2011.3.1129/js/kendo.all.min.js"></script>
<ul id="panel1">
    <li>Test 1
        <ul>
            <li>Sub Item 1</li>
            <li>Sub Item 1
                <ul>
                    <li>Sub Item 1</li>
                    <li>Sub Item 2</li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="k-state-active">Test 2
        <ul>
            <li>Sub Item 1</li>
            <li>Sub Item 2</li>
        </ul>
    </li>
</ul>

JavaScript

function onSelect(e) {
    var item = $(e.item),
        index = item.parentsUntil(".k-panelbar", ".k-item").map(function () {
            return $(this).index();
        }).get().reverse();
    
    index.push(item.index());

    alert(index);
}

var panel = $("#panel1").kendoPanelBar({
    select: onSelect
});