Skip to content

Commit 882c8b4

Browse files
author
Kendo Bot
committed
Sync with Kendo UI Professional
1 parent 42e5bfa commit 882c8b4

File tree

4 files changed

+245
-2
lines changed

4 files changed

+245
-2
lines changed

docs-aspnet-mvc/troubleshoot/troubleshooting.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ For more similar issues, refer to the [article on troubleshooting in Kendo UI fo
4848

4949
1. If the application is using ASP.NET bundles, make sure that the `Scripts.Render("~/bundles/jquery")` block appears before the Kendo UI JavaScript files. If not, do not include jQuery as a `script` element.
5050

51-
### The System.Web.Mvc Versions Referenced in the Application and Which Kendo.Mvc.dll Uses Differ
51+
### The System.Web.Mvc Versions Referenced in the Application and Used by Kendo.Mvc.dll Are Different
5252

5353
`Kendo.Mvc.dll` is regularly updated to support the latest ASP.NET MVC 5 version. If you try to use the latest version of Telerik UI for ASP.NET MVC in an ASP.NET MVC 5 application that uses an older version of `System.Web.Mvc`, an exception is thrown saying that the versions of the `System.Web.Mvc` do not match.
5454

docs/api/javascript/ui/buttongroup.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -228,7 +228,7 @@ Specifies the text of the ButtonGroup item.
228228

229229
### items.encoded `Boolean` *(default: true)*
230230

231-
Specifies is text field of the ButtonGroup item should be encoded.
231+
Specifies if text field of the ButtonGroup item should be encoded.
232232

233233
#### Example
234234

Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
---
2+
title: Asynchronously Clone TreeView node and all of its children
3+
description: An example on how to asynchronously clone a TreeView node with all its children.
4+
type: how-to
5+
page_title: Clone TreeView node and all of its children | Kendo UI TreeView
6+
slug: treeview-clone-node-async
7+
tags: kendo, kendo-ui, treeview, clone, node, all, children
8+
res_type: kb
9+
---
10+
11+
## Environment
12+
<table>
13+
<tr>
14+
<td>Product Version</td>
15+
<td>2018.2.516</td>
16+
</tr>
17+
<tr>
18+
<td>Product</td>
19+
<td>TreeView for Progress® Kendo UI®</td>
20+
</tr>
21+
</table>
22+
23+
## Description
24+
25+
I would like to know if there is a way to deep copy a TreeView node along with all of its children with loadOnDemand set to true?
26+
27+
## Solution
28+
29+
Asynchronously load child nodes in the child data source through [the Node's load() method](https://docs.telerik.com/kendo-ui/api/javascript/data/node/methods/load):
30+
31+
```html
32+
<div id="content">
33+
<button id="cloneNode" class="k-button k-primary">Clone selected node and append it to the TreeView</button>
34+
<div id="treeview"></div>
35+
</div>
36+
37+
<script>
38+
$(document).ready(function() {
39+
var homogeneous = new kendo.data.HierarchicalDataSource({
40+
transport: {
41+
read: {
42+
url: "https://demos.telerik.com/kendo-ui/service/Employees",
43+
dataType: "jsonp"
44+
}
45+
},
46+
schema: {
47+
model: {
48+
id: "EmployeeId",
49+
hasChildren: "HasEmployees"
50+
}
51+
}
52+
});
53+
54+
$("#treeview").kendoTreeView({
55+
dataSource: homogeneous,
56+
dataTextField: "FullName"
57+
});
58+
59+
$("#cloneNode").on("click", function(e) {
60+
var tree = $("#treeview").data("kendoTreeView"),
61+
selected = tree.select();
62+
63+
if (selected.length == 0) {
64+
alert("Select item first!");
65+
return;
66+
}
67+
68+
var dataItem = tree.dataItem(selected);
69+
70+
var load = function (item) {
71+
var that = this,
72+
chain = $.Deferred().resolve();
73+
74+
chain = chain.then(function () {
75+
return item.load();
76+
}).then(function () {
77+
if (item.hasChildren) {
78+
var childrenChain = $.Deferred().resolve();
79+
80+
item.children.data().forEach(function (child) {
81+
(function (child) {
82+
childrenChain = childrenChain.then(function () {
83+
return load(child);
84+
});
85+
})(child);
86+
});
87+
return childrenChain;
88+
}
89+
});
90+
91+
return chain;
92+
}
93+
94+
var updateIds = function (dataItem) {
95+
dataItem.id = kendo.guid();
96+
97+
if (dataItem.items) {
98+
dataItem.items.forEach(function (child) {
99+
updateIds(child);
100+
})
101+
}
102+
}
103+
104+
var item = dataItem.toJSON();
105+
item.hasChildren = true;
106+
107+
tree.append(
108+
item,
109+
null,
110+
function (e) {
111+
var dataItem = tree.dataItem(e);
112+
113+
load.bind(tree)(tree.dataItem(e)).then(function () {
114+
updateIds(dataItem);
115+
});
116+
}
117+
);
118+
119+
load(dataItem);
120+
});
121+
});
122+
</script>
123+
```
124+
125+
## See Also
126+
127+
* [API Reference of the TreeView](https://docs.telerik.com/kendo-ui/api/javascript/ui/treeview).
Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
---
2+
title: Sequential expanding of TreeView items with loadOnDemand
3+
description: An example on how to sequentially expand TreeView items with loadOnDemand
4+
type: how-to
5+
page_title: Sequentially expand items with loadOnDemand | Kendo UI TreeView
6+
slug: treeview-sequentially-expand-items-with-loadondemand
7+
tags: kendo, kendo-ui, treeview, sequentially, expand, items, loadondemand
8+
res_type: kb
9+
---
10+
11+
## Environment
12+
<table>
13+
<tr>
14+
<td>Product Version</td>
15+
<td>2018.2.516</td>
16+
</tr>
17+
<tr>
18+
<td>Product</td>
19+
<td>TreeView for Progress® Kendo UI®</td>
20+
</tr>
21+
</table>
22+
23+
## Description
24+
25+
I would like to know if there is a way to sequentially expand all of the TreeView items with loadOnDemand set to true?
26+
27+
## Solution
28+
29+
Subscribe to the TreeView's dataBound event and [expand()](https://docs.telerik.com/kendo-ui/api/javascript/ui/treeview/methods/expand) all of the currently loaded nodes:
30+
31+
```html
32+
<div id="content">
33+
<div id="treeview"></div>
34+
<button id="expandItems" class="k-button k-primary">Expand all items</button>
35+
</div>
36+
37+
<script>
38+
$(document).ready(function() {
39+
var OrderDetails = {
40+
type: "odata",
41+
transport: {
42+
read: {
43+
url: function(options) {
44+
return kendo.format(
45+
"//demos.telerik.com/kendo-ui/service/Northwind.svc/Products({0})/Order_Details",
46+
options.ProductID
47+
);
48+
}
49+
}
50+
},
51+
schema: {
52+
model: {
53+
hasChildren: function() {
54+
return false;
55+
}
56+
}
57+
}
58+
};
59+
60+
var Products = {
61+
type: "odata",
62+
schema: {
63+
model: {
64+
id: "ProductID",
65+
hasChildren: "Order_Details",
66+
children: OrderDetails
67+
}
68+
},
69+
transport: {
70+
read: {
71+
url: function(options) {
72+
return kendo.format(
73+
"//demos.telerik.com/kendo-ui/service/Northwind.svc/Categories({0})/Products",
74+
options.CategoryID
75+
);
76+
}
77+
}
78+
}
79+
};
80+
81+
var Categories = new kendo.data.HierarchicalDataSource({
82+
type: "odata",
83+
transport: {
84+
read: {
85+
url: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Categories"
86+
}
87+
},
88+
schema: {
89+
model: {
90+
hasChildren: "Products",
91+
id: "CategoryID",
92+
children: Products
93+
}
94+
}
95+
});
96+
97+
$("#treeview").kendoTreeView({
98+
dataSource: Categories,
99+
dataBound: function(e){
100+
if (e.node) {
101+
this.expand(e.node.find('.k-item'));
102+
}
103+
},
104+
dataTextField: ["CategoryName", "ProductName", "OrderID"]
105+
});
106+
107+
$("#expandItems").on("click", function(e) {
108+
$("#treeview").data().kendoTreeView.expand($('.k-item'));
109+
});
110+
});
111+
</script>
112+
```
113+
114+
## See Also
115+
116+
* [API Reference of the TreeView](https://docs.telerik.com/kendo-ui/api/javascript/ui/treeview).

0 commit comments

Comments
 (0)