Skip to content

Commit dadf049

Browse files
author
Kendo Bot
committed
Sync with Kendo UI Professional
1 parent d223733 commit dadf049

File tree

6 files changed

+278
-8
lines changed

6 files changed

+278
-8
lines changed

‎docs/api/javascript/ui/upload.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -450,6 +450,25 @@ Sets the hint of the drop-zone.
450450
});
451451
</script>
452452

453+
### localization.headerStatusPaused `String`
454+
455+
Sets the paused status message of the header.
456+
457+
#### Example
458+
459+
<input type="file" name="files" id="photos" />
460+
<script>
461+
$("#photos").kendoUpload({
462+
async: {
463+
saveUrl: "http://my-app.localhost/save",
464+
removeUrl: "http://my-app.localhost/remove"
465+
},
466+
localization: {
467+
headerStatusPaused: "customHeaderStatusPaused"
468+
}
469+
});
470+
</script>
471+
453472
### localization.headerStatusUploaded `String`
454473

455474
Sets the status message of the header for the uploaded files.

‎docs/controls/scheduling/gantt/how-to/creating-custom-view.md‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -82,9 +82,8 @@ The following example demonstrates how to create a custom view in the Kendo UI G
8282
],
8383
listWidth: 500,
8484
dataBound: function() {
85-
var height = this.timeline.view()._slots.length * 2.5;
86-
this.list.header.find("tr").height(height + "em");
87-
this.list._adjustHeight();
85+
var height = this.timeline.view().header.height();
86+
this.list.thead.find('tr').css('height',height);
8887
},
8988
dataSource: {
9089
data: [{ id: 1, parentId: null, percentComplete: 0.2, orderId: 0, title: "foo", start: new Date("05/05/2014 09:00"), end: new Date("06/06/2014 10:00") },

‎docs/knowledge-base/change-multiselect-tag-background.md‎

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
---
2+
title: Change MultiSelect's tag background from a ToolTip with ColorPalette
3+
page_title: Change MultiSelect's tag background from a ToolTip with ColorPalette | Kendo UI MultiSelect for jQuery
4+
description: An example on how to Change MultiSelect's tag background using a ToolTip with ColorPalette.
5+
type: how-to
6+
slug: change-multiselect-tag-background
7+
previous_url: /knowledge-base/change-multiselect-tag-background
8+
tags: multiselect, tag, change, background, tooltip, colorpalette
9+
res_type: kb
10+
component: multi-select
11+
---
12+
13+
## Environment
14+
15+
<table>
16+
<tr>
17+
<td>Product</td>
18+
<td>Progress Kendo UI MultiSelect</td>
19+
</tr>
20+
<tr>
21+
<td>Operating System</td>
22+
<td>Windows 10 64bit</td>
23+
</tr>
24+
<tr>
25+
<td>Browser</td>
26+
<td>Google Chrome</td>
27+
</tr>
28+
<tr>
29+
<td>Browser Version</td>
30+
<td>86.0.4240.111 (Official Build) (64-bit)</td>
31+
</tr>
32+
</table>
33+
34+
## Description
35+
36+
How can I change the background of the tags in the MultiSelect by picking a color from ColorPalette which is inside a Tooltip?
37+
38+
## Solution
39+
40+
```dojo
41+
<div id="container">
42+
<select id="products"></select>
43+
</div>
44+
<script>
45+
$(document).ready(function() {
46+
$("#products").kendoMultiSelect({
47+
placeholder: "Select products...",
48+
dataTextField: "ProductName",
49+
dataValueField: "ProductID",
50+
autoBind: false,
51+
dataSource: {
52+
type: "odata",
53+
serverFiltering: true,
54+
transport: {
55+
read: {
56+
url: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products",
57+
}
58+
}
59+
},
60+
value: [
61+
{ ProductName: "Chang", ProductID: 2 },
62+
{ ProductName: "Uncle Bob's Organic Dried Pears", ProductID: 7 }
63+
]
64+
});
65+
66+
$("#container").kendoTooltip({
67+
filter: "li",
68+
content: "<div id='color-chooser'></div>",
69+
width:200,
70+
show:function(e){
71+
var sender = e.sender;
72+
var target = e.sender.target();
73+
var colorPalette = $("#color-chooser").data("kendoColorPalette");
74+
if(colorPalette !=undefined){
75+
colorPalette.destroy();
76+
$("#color-chooser").empty();
77+
}
78+
$("#color-chooser").kendoColorPalette({
79+
palette: [ "#ddd1c3", "#d2d2d2", "#746153", "#3a4c8b", "#ffcc33", "#fb455f", "#ac120f" ],
80+
tileSize: 30,
81+
change: function() {
82+
var colorId = this.value();
83+
$(target[0]).css('background', colorId);
84+
sender.hide();
85+
}
86+
});
87+
}
88+
});
89+
});
90+
</script>
91+
```

‎docs/knowledge-base/gantt-select-task-on-expand-collapse.md‎

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
---
2+
title: Select Task On Click of Expand or Collapse Icon
3+
description: An example on how to implement a functionality to select the task when clicking on the expand or collapse icon.
4+
type: how-to
5+
page_title: Implement Task Selection on Click of Expand or Collapse icon | Kendo UI Gantt for jQuery
6+
slug: select-gantt-task-on-expand-collapse
7+
tags: kendo, kendoui, gantt, select, expand, collapse, task, icon, click
8+
ticketid: 1483656
9+
res_type: kb
10+
---
11+
12+
## Environment
13+
14+
<table>
15+
<tr>
16+
<td>Product</td>
17+
<td>Progress Kendo UI Gantt</td>
18+
</tr>
19+
<tr>
20+
<td>Product Version</td>
21+
<td>2020.3.1021</td>
22+
</tr>
23+
</table>
24+
25+
26+
## Description
27+
28+
I want to be able to click on the expand/collapse icon of the parent task and select the current row.
29+
30+
## Solution
31+
32+
1. [Attach an event handler](/api/javascript/data/model/methods/bind) to the [expand](/api/javascript/ui/treelist/methods/expand) and [collapse](/api/javascript/ui/treelist/methods/collapse) events of the built-in TreeList.
33+
1. Get a reference to the current row.
34+
1. Use the Gantt [select method](https://docs.telerik.com/kendo-ui/api/javascript/ui/gantt/methods/select) to select the current row.
35+
36+
```
37+
gantt.list.bind('expand',function(e){
38+
gantt.select(this.element.find('[data-uid="'+e.model.uid+'"]'));
39+
});
40+
41+
gantt.list.bind('collapse',function(e){
42+
gantt.select(this.element.find('[data-uid="'+e.model.uid+'"]'));
43+
});
44+
```
45+
46+
## Example
47+
48+
```dojo
49+
50+
<div id="gantt"></div>
51+
52+
<script>
53+
$(document).ready(function() {
54+
var serviceRoot = "https://demos.telerik.com/kendo-ui/service";
55+
var tasksDataSource = new kendo.data.GanttDataSource({
56+
transport: {
57+
read: {
58+
url: serviceRoot + "/GanttTasks",
59+
dataType: "jsonp"
60+
},
61+
update: {
62+
url: serviceRoot + "/GanttTasks/Update",
63+
dataType: "jsonp"
64+
},
65+
destroy: {
66+
url: serviceRoot + "/GanttTasks/Destroy",
67+
dataType: "jsonp"
68+
},
69+
create: {
70+
url: serviceRoot + "/GanttTasks/Create",
71+
dataType: "jsonp"
72+
},
73+
parameterMap: function(options, operation) {
74+
if (operation !== "read") {
75+
return { models: kendo.stringify(options.models || [options]) };
76+
}
77+
}
78+
},
79+
schema: {
80+
model: {
81+
id: "id",
82+
fields: {
83+
id: { from: "ID", type: "number" },
84+
orderId: { from: "OrderID", type: "number", validation: { required: true } },
85+
parentId: { from: "ParentID", type: "number", defaultValue: null, validation: { required: true } },
86+
start: { from: "Start", type: "date" },
87+
end: { from: "End", type: "date" },
88+
title: { from: "Title", defaultValue: "", type: "string" },
89+
percentComplete: { from: "PercentComplete", type: "number" },
90+
summary: { from: "Summary", type: "boolean" },
91+
expanded: { from: "Expanded", type: "boolean", defaultValue: true }
92+
}
93+
}
94+
}
95+
});
96+
97+
var dependenciesDataSource = new kendo.data.GanttDependencyDataSource({
98+
transport: {
99+
read: {
100+
url: serviceRoot + "/GanttDependencies",
101+
dataType: "jsonp"
102+
},
103+
update: {
104+
url: serviceRoot + "/GanttDependencies/Update",
105+
dataType: "jsonp"
106+
},
107+
destroy: {
108+
url: serviceRoot + "/GanttDependencies/Destroy",
109+
dataType: "jsonp"
110+
},
111+
create: {
112+
url: serviceRoot + "/GanttDependencies/Create",
113+
dataType: "jsonp"
114+
},
115+
parameterMap: function(options, operation) {
116+
if (operation !== "read") {
117+
return { models: kendo.stringify(options.models || [options]) };
118+
}
119+
}
120+
},
121+
schema: {
122+
model: {
123+
id: "id",
124+
fields: {
125+
id: { from: "ID", type: "number" },
126+
predecessorId: { from: "PredecessorID", type: "number" },
127+
successorId: { from: "SuccessorID", type: "number" },
128+
type: { from: "Type", type: "number" }
129+
}
130+
}
131+
}
132+
});
133+
134+
var gantt = $("#gantt").kendoGantt({
135+
dataSource: tasksDataSource,
136+
dependencies: dependenciesDataSource,
137+
views: [
138+
"day",
139+
{ type: "week", selected: true },
140+
"month"
141+
],
142+
columns: [
143+
{ field: "id", title: "ID", width: 60 },
144+
{ field: "title", title: "Title", editable: true, sortable: true },
145+
{ field: "start", title: "Start Time", format: "{0:MM/dd/yyyy}", width: 100, editable: true, sortable: true },
146+
{ field: "end", title: "End Time", format: "{0:MM/dd/yyyy}", width: 100, editable: true, sortable: true }
147+
],
148+
height: 700,
149+
showWorkHours: false,
150+
showWorkDays: false,
151+
snap: false
152+
}).data("kendoGantt");
153+
154+
155+
gantt.list.bind('expand',function(e){
156+
gantt.select(this.element.find('[data-uid="'+e.model.uid+'"]'));
157+
});
158+
159+
gantt.list.bind('collapse',function(e){
160+
gantt.select(this.element.find('[data-uid="'+e.model.uid+'"]'));
161+
});
162+
});
163+
</script>
164+
```

‎src/messages/kendo.messages.en-US.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1121,6 +1121,7 @@ $.extend(true, kendo.ui.Upload.prototype.options.localization,{
11211121
"statusUploaded": "uploaded",
11221122
"statusWarning": "warning",
11231123
"statusFailed": "failed",
1124+
"headerStatusPaused": "Paused",
11241125
"headerStatusUploading": "Uploading...",
11251126
"headerStatusUploaded": "Done",
11261127
"uploadSuccess": "File(s) uploaded successfully.",

‎styles/web/Default/filemanager/_layout.less‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -95,11 +95,7 @@
9595
.k-filemanager-listview {
9696
height: 100%;
9797
flex: 1 1 0%;
98-
99-
// Listview content
100-
.k-listview-content {
101-
overflow: auto;
102-
}
98+
overflow: auto;
10399

104100
// Listview item
105101
.k-listview-item {

0 commit comments

Comments
 (0)