Expand/Collapse removes class from node in TreeList

Progress® Kendo UI® for jQuery Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Unplanned

Last Updated: 21 Oct 2026 13:29 by ADMIN

Piotr

Created on: 03 Jun 2022 13:25

Category: TreeList

Type: Bug Report

Expand/Collapse removes class from node in TreeList

Hi, I found a bug which is reproduced in following dojo: https://dojo.telerik.com/OcaTEbOk
I need to disable row which meet some conditions after dataBound event. To do that class 'k-disabled' is added to each tr in grid and it works fine. Now, I collapse node with disabled rows and expand it again. Even nodes are indeed disabled but odd nodes are enabled (k-disabled class is removed from these rows). Check example provided above. Try to collapse 'Constance Vazquez' node (there are only disabled rows there) and expand again.

2 comments

ADMIN

Rumen

Posted on: 21 Oct 2026 13:29

Hello Piotr,

Thank you for reporting this issue. Following a recent review, we have decided to reopen this bug report, and we apologize that it was closed only because of the time that had passed. We believe it describes a valid scenario. We verified that it still reproduces with the latest version 2026.3.1015.

The cause is that expanding or collapsing a node re-renders the rows without raising the dataBound event, and the rows whose alternating row class changes lose the classes that were added manually. Until this is addressed, you can re-apply the class in the expand and collapse events:

function disableRows(treelist) {
    var data = treelist.dataSource.data();
    for (var i = 0; i < data.length; i++) {
        if (data[i].id > 44) {
            treelist.tbody.find("tr[data-uid='" + data[i].uid + "']").addClass("k-disabled");
        }
    }
}

$("#treelist").kendoTreeList({
    dataSource: dataSource,
    columns: [{ field: "Position" }, { field: "Name" }, { field: "Phone" }],
    dataBound: function () {
        disableRows(this);
    },
    expand: function (e) {
        var treelist = e.sender;
        setTimeout(function () { disableRows(treelist); });
    },
    collapse: function (e) {
        var treelist = e.sender;
        setTimeout(function () { disableRows(treelist); });
    }
});

Note that the expand and collapse events are raised only when the user clicks the icon. If you expand or collapse nodes through the expand and collapse methods, call the disableRows function manually afterwards.

If it still affects you, please vote for it and share details about your scenario and its impact, so we can prioritize it properly.

Regards,
Rumen
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

ADMIN

Neli

Posted on: 12 Jan 2026 13:53

This behavior was originally reported several years ago and has not received significant demand or follow-up from the community since then. This is why we plan to prioritize more impactful and widely requested improvements.

If this limitation is still affecting your scenario, please share additional context or use cases. This will help us better assess severity and reconsider prioritization in the future. Thank you!

Regards,
Neli
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.