Skip to content

Commit f32d0b4

Browse files
author
Kendo Bot
committed
Sync with Kendo UI Professional
1 parent c9d2a27 commit f32d0b4

File tree

4 files changed

+238
-15
lines changed

4 files changed

+238
-15
lines changed

docs/knowledge-base/filter-all-columns-with-one-textbox.md

Lines changed: 24 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ description: Example on how to filter all columns with single textbox
44
type: how-to
55
page_title: Filter all columns with single textbox | Kendo UI Grid
66
slug: filter-all-columns-with-one-textbox
7-
tags: grid, filter, all, columns, single, input, textbox, one
7+
tags: grid, filter, all, columns, single, input, textbox, one, global, search, entire, whole
88
res_type: kb
99
component: grid
1010
---
@@ -23,7 +23,7 @@ component: grid
2323

2424
## Description
2525

26-
I want the users to search through all columns of the grid using one single input field.
26+
I want the users to search through all columns of the grid using one single input field. How can I implement a global grid search?
2727

2828
## Solution
2929

@@ -39,11 +39,20 @@ Within the [input event](https://developer.mozilla.org/en-US/docs/Web/Events/inp
3939
<div id="grid"></div>
4040

4141
<script>
42-
4342
function isNumeric(n) {
4443
return !isNaN(parseFloat(n)) && isFinite(n);
4544
}
4645
46+
function getBoolean(str) {
47+
if("true".startsWith(str)){
48+
return true;
49+
} else if("false".startsWith(str)){
50+
return false;
51+
} else {
52+
return null;
53+
}
54+
}
55+
4756
$(document).ready(function () {
4857
var crudServiceBaseUrl = "https://demos.telerik.com/kendo-ui/service",
4958
dataSource = new kendo.data.DataSource({
@@ -101,11 +110,9 @@ Within the [input event](https://developer.mozilla.org/en-US/docs/Web/Events/inp
101110
var grid = $('#grid').data('kendoGrid');
102111
var columns = grid.columns;
103112
104-
105113
var filter = { logic: 'or', filters: [] };
106114
columns.forEach(function (x) {
107115
if (x.field) {
108-
debugger
109116
var type = grid.dataSource.options.schema.model.fields[x.field].type;
110117
if (type == 'string') {
111118
filter.filters.push({
@@ -120,10 +127,8 @@ Within the [input event](https://developer.mozilla.org/en-US/docs/Web/Events/inp
120127
field: x.field,
121128
operator: 'eq',
122129
value: e.target.value
123-
})
124-
125-
}
126-
130+
});
131+
}
127132
128133
} else if (type == 'date') {
129134
var date = new Date(e.target.value)
@@ -135,14 +140,19 @@ Within the [input event](https://developer.mozilla.org/en-US/docs/Web/Events/inp
135140
value: date
136141
})
137142
}
138-
}
143+
} else if (type == 'boolean' && getBoolean(e.target.value) !== null) {
144+
var bool = getBoolean(e.target.value);
145+
filter.filters.push({
146+
field: x.field,
147+
operator: 'eq',
148+
value: bool
149+
});
150+
}
139151
}
140-
141-
})
152+
});
142153
grid.dataSource.filter(filter);
143-
})
154+
});
144155
});
145-
146156
</script>
147157
</div>
148158
```
Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
---
2+
title: Bind to the Events of the Grid Numeric Editor
3+
description: An example on how to attach event Listener to the Grid editor
4+
type: how-to
5+
page_title: Attach Event Listener to the Grid Numeric Editor
6+
slug: grid-attach-event-listener-to-the-grid-numeric-editor
7+
tags: grid, numeric, editor, event
8+
ticketid: 1142675
9+
res_type: kb
10+
11+
---
12+
13+
## Environment
14+
<table>
15+
<tr>
16+
<td>Product</td>
17+
<td>Progress® Kendo UI®</td>
18+
</tr> <tr>
19+
<td>Made with version</td>
20+
<td>2017.3.1026/</td>
21+
</tr>
22+
</table>
23+
24+
25+
## Description
26+
27+
How to bind to the spin event of the Grid NumericTextBox editor?
28+
29+
## Solution
30+
31+
This could be achieved by [binding](https://docs.telerik.com/kendo-ui/intro/widget-basics/events-and-methods#event-binding-after-initialization) to the widget on the [edit](https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-edit) event of the Grid.
32+
33+
````
34+
edit:function(e){
35+
var numeric = $(e.container).find('[data-role="numerictextbox"]').data('kendoNumericTextBox')
36+
if(numeric !== undefined){
37+
numeric.bind("spin", function(e) {
38+
console.log("spin event handler");
39+
});
40+
}
41+
}
42+
````
Lines changed: 171 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,171 @@
1+
---
2+
title: Server Response With ServerGrouping
3+
description: An example with response expected with serverGrouping
4+
type: how-to
5+
page_title: Format of the Response With ServerGrouping
6+
slug: grid-format-of-the-response-with-server-grouping
7+
tags: grid, server, grouping
8+
ticketid: 1138311
9+
res_type: kb
10+
11+
---
12+
13+
## Environment
14+
<table>
15+
<tr>
16+
<td>Product</td>
17+
<td>Grid for Progress® Kendo UI®</td>
18+
</tr>
19+
<tr>
20+
<td>Operating System</td>
21+
<td>Windows 7 64bit</td>
22+
</tr>
23+
<tr>
24+
<td>Browser</td>
25+
<td>Google Chrome</td>
26+
</tr>
27+
<tr>
28+
<td>Browser Version</td>
29+
<td>62.0.3202.75</td>
30+
</tr> <tr>
31+
<td>Made with Version</td>
32+
<td>2017.3.1026</td>
33+
</tr>
34+
</table>
35+
36+
37+
## Description
38+
39+
How to format the server response when serverGrouping is set to true?
40+
41+
## Solution
42+
43+
The expected format can be observed [here](https://docs.telerik.com/kendo-ui/framework/datasource/basic-usage#server-grouping).
44+
45+
Please check the following example parsing the server response and grouping the Grid:
46+
47+
````html
48+
<div id="grid"></div>
49+
<script>
50+
$(document).ready(function() {
51+
52+
$("#grid").kendoGrid({
53+
dataSource: {
54+
transport: {
55+
read: function(options) {
56+
var response = {};
57+
response.group = [{
58+
field: "companyName",
59+
value: "the name of company",
60+
items: [{
61+
id: "1",
62+
contractName: "name of contract",
63+
companyName: "the name of company"
64+
},{
65+
id: "2",
66+
contractName: "name of contract number 2",
67+
companyName: "the name of company"
68+
},{
69+
id: "3",
70+
contractName: "name of contract number 3",
71+
companyName: "the name of company"
72+
}],
73+
hasSubgroups: false,
74+
aggregates: []
75+
}];
76+
77+
response.data = [{
78+
id: "1",
79+
contractName: "name of contract",
80+
companyName: "the name of company"
81+
},{
82+
id: "2",
83+
contractName: "name of contract number 2",
84+
companyName: "the name of company"
85+
},
86+
{
87+
id: "3",
88+
contractName: "name of contract number 3",
89+
companyName: "the name of company"
90+
}
91+
]
92+
response.total = 3
93+
options.success(response);
94+
}
95+
},
96+
pageSize: 100,
97+
serverPaging: true,
98+
serverSorting: true,
99+
serverGrouping: true,
100+
serverAggregates: true,
101+
group: {
102+
field: "companyName"
103+
},
104+
schema: {
105+
data: function(e) {
106+
return e.data;
107+
},
108+
groups: function(e) {
109+
return e.group;
110+
},
111+
total: function(e) {
112+
return e.total;
113+
},
114+
parse: function(response) {
115+
//Data group
116+
117+
var groups = response.group;
118+
var contractGroup = [];
119+
for(var i = 0; i < groups.length; i++) {
120+
var group = groups[i];
121+
var items = group.items;
122+
var contracts = [];
123+
for(var j = 0; j < items.length; j++) {
124+
var item = items[j];
125+
var contract = {
126+
id: item.id,
127+
contractName: item.contractName,
128+
companyName: item.companyName
129+
}
130+
contracts.push(contract);
131+
}
132+
group.items = contracts;
133+
contractGroup.push(group);
134+
}
135+
response.group = contractGroup;
136+
//Data group end
137+
138+
//Data default
139+
var datas = response.data;
140+
var contracts = [];
141+
for(var i = 0; i < datas.length; i++) {
142+
var data = datas[i];
143+
var contract = {
144+
id: data.id,
145+
contractName: data.contractName,
146+
companyName: data.companyName
147+
}
148+
contracts.push(contract);
149+
}
150+
response.data = contracts;
151+
//Data default end
152+
return response;
153+
},
154+
model: {
155+
id: "id",
156+
fields: {
157+
costCodeName: { type: "string" },
158+
contractName: { type: "string" },
159+
companyName: { type: "string" },
160+
}
161+
}
162+
},
163+
},
164+
height: 780,
165+
scrollable: true,
166+
sortable: false,
167+
pageable: true,
168+
});
169+
})
170+
</script>
171+
````

src/kendo.window.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1387,7 +1387,7 @@
13871387
.find(".k-resize-handle,.k-window-titlebar").off(NS);
13881388

13891389
$(window).off("resize" + NS + this._marker);
1390-
$(window).off("focus"+ NS);
1390+
$(window).off(NS);
13911391

13921392
clearTimeout(this._loadingIconTimeout);
13931393

0 commit comments

Comments
 (0)