Skip to content

Commit 956aee3

Browse files
author
Kendo Bot
committed
Sync with Kendo UI Professional
1 parent 5c2ebdb commit 956aee3

File tree

95 files changed

+1174
-1104
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

95 files changed

+1174
-1104
lines changed

build/package-core.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,6 @@
99
"dependencies": {
1010
"jquery": "1.10.0 - 3.6.0"
1111
},
12-
"main": "js/kendo.ui.core.js"
12+
"main": "js/kendo.ui.core.js",
13+
"typings": "index.d.ts"
1314
}
Lines changed: 190 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,190 @@
1+
---
2+
title: Local Binding
3+
page_title: Local Binding
4+
description: "Get started with the PivotGridV2 for {{ site.framework }} and learn how to bind it to a local data."
5+
slug: htmlhelpers_pivotgridv2_aspnetcore_localbinding
6+
position: 4
7+
---
8+
9+
When configured for local binding, the PivotGridV2 for {{ site.framework }} will serialize the data as part of its data source and will perform all data operations on the client.
10+
11+
To bind the PivotGridV2 for {{ site.framework }} to local flat data:
12+
13+
1. Define a model class or use an existing one from your application.
14+
15+
public class ProductViewModel
16+
{
17+
[ScaffoldColumn(false)]
18+
public int ProductID
19+
{
20+
get;
21+
set;
22+
}
23+
24+
[Required]
25+
[Display(Name = "Product name")]
26+
public string ProductName
27+
{
28+
get;
29+
set;
30+
}
31+
32+
[Display(Name = "Unit price")]
33+
[DataType(DataType.Currency)]
34+
[Range(0, int.MaxValue)]
35+
public decimal UnitPrice
36+
{
37+
get;
38+
set;
39+
}
40+
41+
[Display(Name = "Units in stock")]
42+
[DataType("Integer")]
43+
[Range(0, int.MaxValue)]
44+
public int UnitsInStock
45+
{
46+
get;
47+
set;
48+
}
49+
50+
public bool Discontinued
51+
{
52+
get;
53+
set;
54+
}
55+
56+
[Display(Name = "Last supply")]
57+
[DataType(DataType.Date)]
58+
public DateTime LastSupply
59+
{
60+
get;
61+
set;
62+
}
63+
64+
[DataType("Integer")]
65+
public int UnitsOnOrder
66+
{
67+
get;
68+
set;
69+
}
70+
71+
[UIHint("ClientCategory")]
72+
public CategoryViewModel Category
73+
{
74+
get;
75+
set;
76+
}
77+
78+
public int? CategoryID { get; set; }
79+
80+
public string QuantityPerUnit { get; set; }
81+
}
82+
83+
1. In the `Index` action return an `IEnumerable` of the model type with the view.
84+
85+
public ActionResult Index()
86+
{
87+
var entities = new SampleEntities();
88+
89+
var result = entities.Products.Select(product => new ProductViewModel
90+
{
91+
ProductID = product.ProductID,
92+
ProductName = product.ProductName,
93+
UnitPrice = product.UnitPrice.HasValue ? product.UnitPrice.Value : default(decimal),
94+
UnitsInStock = product.UnitsInStock.HasValue ? product.UnitsInStock.Value : default(short),
95+
QuantityPerUnit = product.QuantityPerUnit,
96+
Discontinued = product.Discontinued,
97+
UnitsOnOrder = product.UnitsOnOrder.HasValue ? (int)product.UnitsOnOrder.Value : default(int),
98+
CategoryID = product.CategoryID,
99+
Category = new CategoryViewModel()
100+
{
101+
CategoryID = product.Category.CategoryID,
102+
CategoryName = product.Category.CategoryName
103+
},
104+
LastSupply = DateTime.Today
105+
}).ToList();
106+
107+
return View(result);
108+
}
109+
110+
1. In the `Index.cshtml` view declare the model, an `IEnumerable` of the model type. Declare and configure the PivotGridV2.
111+
112+
```HtmlHelper
113+
@model IEnumerable<MyApplication.Models.ProductViewModel>
114+
115+
@(Html.Kendo().PivotContainer()
116+
.Name("container")
117+
.ConfiguratorPosition("left")
118+
.Content(@<text>
119+
@(Html.Kendo().PivotConfiguratorV2()
120+
.Name("configurator")
121+
.Sortable()
122+
.Filterable())
123+
124+
@(Html.Kendo().PivotGridV2<Kendo.Mvc.Examples.Models.ProductViewModel>()
125+
.Name("pivotgrid")
126+
.HtmlAttributes(new { @class = "hidden-on-narrow" })
127+
.Configurator("#configurator")
128+
.ColumnWidth(120)
129+
.Height(570)
130+
.BindTo(Model)
131+
.DataSource(dataSource => dataSource
132+
.Custom()
133+
.Schema(schema => schema
134+
.Model(m => m.Field("CategoryName", typeof(string)).From("Category.CategoryName"))
135+
.Cube(cube => cube
136+
.Dimensions(dimensions =>
137+
{
138+
dimensions.Add(model => model.ProductName).Caption("All Products");
139+
dimensions.Add("CategoryName").Caption("All Categories");
140+
dimensions.Add(model => model.Discontinued).Caption("Discontinued");
141+
})
142+
.Measures(measures =>
143+
{
144+
measures.Add("Average").Format("{0:c}").Field(model => model.UnitPrice).AggregateName("average");
145+
measures.Add("Sum").Format("{0:c}").Field(model => model.UnitPrice).AggregateName("sum");
146+
})
147+
))
148+
.Columns(columns =>
149+
{
150+
columns.Add("CategoryName").Expand(true);
151+
columns.Add("ProductName");
152+
})
153+
.Rows(rows => rows.Add("Discontinued").Expand(true))
154+
.Measures(measures => measures.Values("Sum"))
155+
.Events(e => e.Error("onError"))
156+
)
157+
)
158+
159+
@(Html.Kendo().PivotConfiguratorButton()
160+
.Name("Button")
161+
.Configurator("configurator")
162+
)
163+
164+
</text>))
165+
166+
<script>
167+
function onError(e) {
168+
alert("error: " + kendo.stringify(e.errors[0]));
169+
}
170+
</script>
171+
```
172+
173+
174+
For a full example, refer to the [PivotGridV2 Local Binding demo](https://demos.telerik.com/{{ site.platform }}/pivotgridv2/local-flat-data-binding).
175+
176+
## Known Limitations
177+
178+
When the PivotGridV2 is bound to a flat data structure, the component processes the data on the client (browser) and creates a client cube representation [(configuration)](https://docs.telerik.com/kendo-ui/api/javascript/data/pivotdatasource/configuration/schema#schemacube). The PivotGridV2 relies on the processing power of the browser to project the data and produce the required categorized data output. The PivotGridV2 does not restrict the maximum amount of data that you can load into it, but there are limitations related to the browser's capability to handle the loaded dataset.
179+
180+
The symptoms for an overloaded browser are:
181+
- The browser is loading extremely slowly or gets unresponsive for a long time.
182+
- The browser is crashing when loading or updating the dimensions/measures.
183+
184+
If you observe any of these symptoms, this means you have hit the processing limit of the browser. To work around this issue, use a dedicated [OLAP](https://en.wikipedia.org/wiki/Online_analytical_processing) solution like Microsoft [SSAS](https://technet.microsoft.com/en-us/library/ms175609(v=sql.90).aspx).
185+
186+
## See Also
187+
188+
* [OLAP Cube Fundamentals]({% slug htmlhelpers_pivotgridv2_aspnetcore_fundamentals %})
189+
* [OLAP Cube Setup]({% slug htmlhelpers_pivotgridv2_aspnetcore_olap_cube_setup %})
190+
* [PivotConfiguratorV2 JavaScript API Reference](/api/javascript/ui/pivotconfiguratorv2)

docs-aspnet/html-helpers/editors/autocomplete/appearance.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ The following values are available for the `Size` option:
2929
- `Small`—small size (applies the `k-input-sm` class to the wrapping span element).
3030
- `Medium`—medium size (applies the `k-input-md` class to the wrapping span element).
3131
- `Large`—large size (applies the `k-input-lg` class to the wrapping span element).
32-
- `Null`—unset.
32+
- `None`—unset.
3333

3434
The following example demonstrates how to set `Size` in the declaration of the AutoComplete:
3535

@@ -100,7 +100,7 @@ The following values are available for the `Rounded` option:
100100
- `Medium`—medium border radius (applies the `k-rounded-md` class to the wrapping span element).
101101
- `Large`—large border radius (applies the `k-rounded-lg` class to the wrapping span element).
102102
- `Full`—largest border radius (applies the `k-rounded-full` class to the wrapping span element).
103-
- `Null`—unset.
103+
- `None`—unset.
104104

105105
The following example demonstrates how to set `Rounded` in the declaration of the AutoComplete:
106106

@@ -171,7 +171,7 @@ The following values are available for the `FillMode` option:
171171
- `Solid`—applies the `k-input-solid` class to the wrapping span element.
172172
- `Flat`—applies the `k-input-flat` class to the wrapping span element.
173173
- `Outline`—applies the `k-input-outline` class to the wrapping span element.
174-
- `Null`—unset.
174+
- `None`—unset.
175175

176176
The following example demonstrates how to set `FillMode` in the declaration of the AutoComplete:
177177

docs-aspnet/html-helpers/editors/checkbox/appearance.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ The following values are available for the `Size` option:
4646
- `Small`
4747
- `Medium`
4848
- `Large`
49-
- `Null`
49+
- `None`
5050

5151
The default size value is `Medium` and it is added as a class `k-checkbox-md` to the input element.
5252

@@ -89,7 +89,7 @@ The following values are available for the `Rounded` option:
8989
- `Small`
9090
- `Medium`
9191
- `Large`
92-
- `Null`
92+
- `None`
9393

9494
The default value is `Medium` and it is added as a class `k-roundend-md` to the input element.
9595

docs-aspnet/html-helpers/editors/colorpicker/appearance.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ The following values are available for the `Size` option:
2929
- `Small`—small size (applies the `k-input-sm` class to the wrapping span element).
3030
- `Medium`—medium size (applies the `k-input-md` class to the wrapping span element).
3131
- `Large`—large size (applies the `k-input-lg` class to the wrapping span element).
32-
- `Null`—unset.
32+
- `None`—unset.
3333

3434
The following example demonstrates how to set `Size` in the declaration of the ColorPicker:
3535

@@ -71,7 +71,7 @@ The following values are available for the `Rounded` option:
7171
- `Medium`—medium border radius (applies the `k-rounded-md` class to the wrapping span element).
7272
- `Large`—large border radius (applies the `k-rounded-lg` class to the wrapping span element).
7373
- `Full`—largest border radius (applies the `k-rounded-full` class to the wrapping span element).
74-
- `Null`—unset.
74+
- `None`—unset.
7575

7676
The following example demonstrates how to set `Rounded` in the declaration of the ColorPicker:
7777

@@ -112,7 +112,7 @@ The following values are available for the `FillMode` option:
112112
- `Solid`—applies the `k-input-solid` class to the wrapping span element.
113113
- `Flat`—applies the `k-input-flat` class to the wrapping span element.
114114
- `Outline`—applies the `k-input-outline` class to the wrapping span element.
115-
- `Null`—unset.
115+
- `None`—unset.
116116

117117
The following example demonstrates how to set `FillMode` in the declaration of the ColorPicker:
118118

docs-aspnet/html-helpers/editors/combobox/appearance.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ The following values are available for the `Size` option:
2929
- `Small`—small size (applies the `k-input-sm` class to the wrapping span element)
3030
- `Medium`—medium size (applies the `k-input-md` class to the wrapping span element)
3131
- `Large`—large size (applies the `k-input-lg` class to the wrapping span element)
32-
- `Null`—unset.
32+
- `None`—unset.
3333

3434
The following example demonstrates how to set `Size` in the declaration of the ComboBox:
3535

@@ -103,7 +103,7 @@ The following values are available for the `Rounded` option:
103103
- `Medium`—medium border radius (applies the `k-rounded-md` class to the wrapping span element)
104104
- `Large`—large border radius (applies the `k-rounded-lg` class to the wrapping span element)
105105
- `Full`—largest border radius (applies the `k-rounded-full` class to the wrapping span element)
106-
- `Null`—unset.
106+
- `None`—unset.
107107

108108
The following example demonstrates how to set `Rounded` in the declaration of the ComboBox:
109109

@@ -175,7 +175,7 @@ The following values are available for the `FillMode` option:
175175
- `Solid`—applies the `k-input-solid` class to the wrapping span element
176176
- `Flat`—applies the `k-input-flat` class to the wrapping span element
177177
- `Outline`—applies the `k-input-outline` class to the wrapping span element
178-
- `Null`—unset.
178+
- `None`—unset.
179179

180180
The following example demonstrates how to set `FillMode` in the declaration of the ComboBox:
181181

docs-aspnet/html-helpers/editors/dateinput/appearance.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ The following values are available for the `Size` option:
2929
- `Small`—small size (applies the `k-input-sm` class to the wrapping span element)
3030
- `Medium`—medium size (applies the `k-input-md` class to the wrapping span element)
3131
- `Large`—large size (applies the `k-input-lg` class to the wrapping span element)
32-
- `Null`—unset.
32+
- `None`—unset.
3333

3434
The default size value is `Medium`.
3535

@@ -48,7 +48,7 @@ The following values are available for the `Rounded` option:
4848
- `Medium`—medium border radius (applies the `k-rounded-md` class to the wrapping span element)
4949
- `Large`—large border radius (applies the `k-rounded-lg` class to the wrapping span element)
5050
- `Full`—largest border radius (applies the `k-rounded-full` class to the wrapping span element)
51-
- `Null`—unset.
51+
- `None`—unset.
5252

5353
The default rounded value is `Medium`.
5454

@@ -66,7 +66,7 @@ The following values are available for the `FillMode` option:
6666
- `Solid`—applies the `k-input-solid` class to the wrapping span element
6767
- `Flat`—applies the `k-input-flat` class to the wrapping span element
6868
- `Outline`—applies the `k-input-outline` class to the wrapping span element
69-
- `Null`—unset.
69+
- `None`—unset.
7070

7171
The default fillMode value is `Solid`.
7272

docs-aspnet/html-helpers/editors/datepicker/appearance.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ The following values are available for the `Size` option:
2929
- `Small`—small size (applies the `k-input-sm` class to the wrapping span element).
3030
- `Medium`—medium size (applies the `k-input-md` class to the wrapping span element).
3131
- `Large`—large size (applies the `k-input-lg` class to the wrapping span element).
32-
- `Null`—unset.
32+
- `None`—unset.
3333

3434
The following example demonstrates how to set `Size` in the declaration of the DatePicker:
3535

@@ -66,7 +66,7 @@ The following values are available for the `Rounded` option:
6666
- `Medium`—medium border radius (applies the `k-rounded-md` class to the wrapping span element).
6767
- `Large`—large border radius (applies the `k-rounded-lg` class to the wrapping span element).
6868
- `Full`—largest border radius (applies the `k-rounded-full` class to the wrapping span element).
69-
- `Null`—unset.
69+
- `None`—unset.
7070

7171
The following example demonstrates how to set `Rounded` in the declaration of the DatePicker:
7272

@@ -102,7 +102,7 @@ The following values are available for the `FillMode` option:
102102
- `Solid`—applies the `k-input-solid` class to the wrapping span element.
103103
- `Flat`—applies the `k-input-flat` class to the wrapping span element.
104104
- `Outline`—applies the `k-input-outline` class to the wrapping span element.
105-
- `Null`—unset.
105+
- `None`—unset.
106106

107107
The following example demonstrates how to set `FillMode` in the declaration of the DatePicker:
108108

docs-aspnet/html-helpers/editors/daterangepicker/appearance.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ The following values are available for the `Size` option:
2929
- `Small`—small size (applies the `k-input-sm` class to the wrapping span element)
3030
- `Medium`—medium size (applies the `k-input-md` class to the wrapping span element)
3131
- `Large`—large size (applies the `k-input-lg` class to the wrapping span element)
32-
- `Null`—unset.
32+
- `None`—unset.
3333

3434
The following example demonstrates how to set `Size` in the declaration of the DateRangePicker:
3535

@@ -66,7 +66,7 @@ The following values are available for the `Rounded` option:
6666
- `Medium`—medium border radius (applies the `k-rounded-md` class to the wrapping span element)
6767
- `Large`—large border radius (applies the `k-rounded-lg` class to the wrapping span element)
6868
- `Full`—largest border radius (applies the `k-rounded-full` class to the wrapping span element)
69-
- `Null`—unset.
69+
- `None`—unset.
7070

7171
The following example demonstrates how to set `Rounded` in the declaration of the DateRangePicker:
7272

@@ -103,7 +103,7 @@ The following values are available for the `FillMode` option:
103103
- `Solid`—applies the `k-input-solid` class to the wrapping span element
104104
- `Flat`—applies the `k-input-flat` class to the wrapping span element
105105
- `Outline`—applies the `k-input-outline` class to the wrapping span element
106-
- `Null`—unset.
106+
- `None`—unset.
107107

108108
The following example demonstrates how to set `FillMode` in the declaration of the DateRangePicker:
109109

0 commit comments

Comments
 (0)