Reputation: 624
I want to show my Kendo UI TreeView expanded at all time, but it will only show collapsed. When reloading the datasource, I can see a flash of the expanded tree, but then it collapses.
var locationTreeView = $("#treeViewLocations").kendoTreeView({
checkboxes: {
checkChildren: false,
template: "# if(item.showCheckbox){# <input type='checkbox' name='selectedLocations' value='#= item.value #' />#}#"
},
dataTextField: "text",
dataSource: {
transport: {
read: {
url: window.location.origin + "/api/v1/bookingrequestlocation",
dataType: "json",
type: "GET",
data: { bookingSeasonPeriodId: bookingSeasonPeriod.value() },
}
},
schema: {
model: {
id: "value",
children: "items",
hasChildren: "hasChildren",
}
}
}}).data("kendoTreeView");
expandTreeView();
function changeSeason() {
locationTreeView.dataSource.read();
expandTreeView();}
function expandTreeView() {
locationTreeView.expand(".k-item");}
Upvotes: 1
Views: 2682
Reputation: 842
Add the following code right after creating the treeview
var tree = $("#TREEVIEWID").data("kendoTreeView");
function expandTreeNodes() {
if ($('.k-item').length) {
var expandedLength = $('.k-item').length;
tree.expand(".k-item");
if (expandedLength < $('.k-item').length) {
expandTreeNodes();
}
}
}
Upvotes: 0
Reputation: 1
It's Working For Me...Thanks...I have added A DataBound Event Like this
.Events(e => e.DataBound("ExpandAllTree"))
and In that Method
function ExpandAllTree() {
var treeview = $("#TreeView").data("kendoTreeView");
treeview.collapse(".k-item");
}
and It's Working Perfectly...
Upvotes: 0