Skip to content

Commit 4b529fd

Browse files
author
Kendo Bot
committed
Sync with Kendo UI Professional
1 parent 4f6ac34 commit 4b529fd

File tree

22 files changed

+441
-16
lines changed

22 files changed

+441
-16
lines changed

docs-aspnet/_config-mvc.yml

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,12 @@ knowledge-base/treelist-checkbox-column.md,
5555
knowledge-base/upload-resize-image-before-upload.md,
5656
knowledge-base/validator-basic-form-validation.md,
5757
knowledge-base/vs-online-continuous-integration-login-problem.md,
58+
html-helpers/editors/autocomplete/binding/razor-pages.md,
5859
html-helpers/editors/dropdownlist/binding/razor-page.md,
60+
html-helpers/editors/combobox/binding/razor-page.md,
61+
html-helpers/editors/dropdowntree/binding/razor-page.md,
62+
html-helpers/editors/multicolumncombobox/binding/razor-page.md,
63+
html-helpers/editors/multiselect/binding/razor-page.md,
5964
html-helpers/layout/form/razor-page.md,
6065
html-helpers/scheduling/scheduler/binding/razor-page.md]
6166

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
---
2+
title: Razor Page
3+
page_title: Configure a DataSource for the AutoComplete for Remote Binding in Razor Page.
4+
description: "An example on how to configure the remote binding DataSource to populate the Telerik UI AutoComplete HtmlHelper for {{ site.framework }} in a Razor Page using CRUD Operations."
5+
slug: htmlhelpers_autocomplete_razorpage_aspnetcore
6+
position: 3
7+
---
8+
9+
# Razor Page
10+
11+
This article describes how to configure a Remote DataSource of a Telerik AutoComplete in a RazorPage scenario.
12+
13+
In order to set up the AutoComplete component bindings, you need to configure the `Read` method of its `DataSource` instance. The URL in this method should refer the name of the method in the PageModel. In this method, you can also pass additional parameters, such as filter string and antiforgery token (see `dataFunction`). See the implementation details in the example below, and for the full project with RazorPages examples, visit our [GitHub repository](https://github.com/telerik/ui-for-aspnet-core-examples/tree/master/Telerik.Examples.RazorPages).
14+
15+
```tab-RazorPage(csthml)
16+
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
17+
@Html.AntiForgeryToken()
18+
19+
@(Html.Kendo().AutoComplete()
20+
.Name("autocomplete")
21+
.DataTextField("ShipName")
22+
.Filter("contains")
23+
.MinLength(3)
24+
.HtmlAttributes(new { style = "width:100%" })
25+
.DataSource(ds => ds
26+
.Custom()
27+
.Transport(transport => transport
28+
.Read(r => r
29+
.Url("/AutoComplete/AutoCompleteCRUDOperations?handler=Read").Data("dataFunction")
30+
))
31+
.ServerFiltering(true)
32+
)
33+
)
34+
<script>
35+
36+
function dataFunction() {
37+
var value = $("#autocomplete").val();
38+
return {
39+
__RequestVerificationToken: kendo.antiForgeryTokens().__RequestVerificationToken,
40+
filterValue: value
41+
};
42+
}
43+
44+
</script>
45+
```
46+
```tab-PageModel(cshtml.cs)
47+
public JsonResult OnGetRead(string filterValue)
48+
{
49+
if (filterValue != null)
50+
{
51+
//orders is the DBContext
52+
var filteredData = orders.Where(p => p.ShipName.Contains(filterValue));
53+
return new JsonResult(filteredData);
54+
}
55+
return new JsonResult(orders);
56+
}
57+
```
58+
59+
## See Also
60+
61+
* [Razor Pages Support]({% slug razor_pages_integration_aspnetmvc6_aspnetmvc %})
62+
* [DataBinding Overview]({% slug htmlhelpers_autocomplete_databinding_aspnetcore %})
63+

docs-aspnet/html-helpers/editors/combobox/binding/model-binding.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ page_title: Model Binding
44
description: "Learn how to implement Model Binding with Telerik UI ComboBox HtmlHelper for {{ site.framework }}."
55
previous_url: /helpers/editors/combobox/binding/model-binding
66
slug: htmlhelpers_combobox_modelbinding_aspnetcore
7-
position: 5
7+
position: 6
88
---
99

1010
# Model Binding
Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
---
2+
title: Razor Page
3+
page_title: Configure a DataSource for the ComboBox for Remote Binding in Razor Page.
4+
description: "An example on how to configure the remote binding DataSource to populate the Telerik UI ComboBox HtmlHelper for {{ site.framework }} in a Razor Page using CRUD Operations."
5+
slug: htmlhelpers_combobox_razorpage_aspnetcore
6+
position: 3
7+
---
8+
9+
# Razor Page
10+
11+
# ComboBox Remote Data Binding in Razor Pages
12+
13+
This article describes how to configure a Remote DataSource of a Telerik ComboBox in a RazorPage scenario.
14+
15+
In order to set up the ComboBox component bindings, you need to configure the `Read` method of its `DataSource` instance. The URL in this method should refer the name of the method in the PageModel. In this method, you can also pass additional parameters, such as filter string and antiforgery token (see `dataFunction`). See the implementation details in the example below, and for the full project with RazorPages examples, visit our [GitHub repository](https://github.com/telerik/ui-for-aspnet-core-examples/tree/master/Telerik.Examples.RazorPages).
16+
17+
```tab-RazorPage(csthml)
18+
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
19+
@Html.AntiForgeryToken()
20+
21+
@(Html.Kendo().ComboBox()
22+
.Name("combobox")
23+
.DataTextField("ShipName")
24+
.DataValueField("ShipCity")
25+
.AutoBind(false)
26+
.Filter(FilterType.Contains)
27+
.DataSource(ds => ds
28+
.Custom()
29+
.Transport(transport => transport
30+
.Read(r => r
31+
.Url("/ComboBox/ComboBoxCrud?handler=Read").Data("dataFunction")
32+
))
33+
.ServerFiltering(true)
34+
)
35+
)
36+
37+
<script>
38+
function dataFunction(e) {
39+
var filterValue = '';
40+
if (e.filter.filters[0]) {
41+
filterValue = e.filter.filters[0].value;
42+
}
43+
44+
return {
45+
__RequestVerificationToken: kendo.antiForgeryTokens().__RequestVerificationToken,
46+
filterValue: filterValue
47+
};
48+
}
49+
</script>
50+
```
51+
```tab-PageModel(cshtml.cs)
52+
53+
public JsonResult OnGetRead(string filterValue)
54+
{
55+
if (filterValue != null)
56+
{
57+
var filteredData = orders.Where(p => p.ShipName.Contains(filterValue));
58+
return new JsonResult(filteredData);
59+
}
60+
return new JsonResult(orders);
61+
}
62+
```
63+
64+
## See Also
65+
66+
* [Razor Pages Support]({% slug razor_pages_integration_aspnetmvc6_aspnetmvc %})
67+
* [DataBinding Overview]({% slug htmlhelpers_combobox_databinding_aspnetcore %})
68+

docs-aspnet/html-helpers/editors/combobox/binding/server-binding.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ page_title: Server Binding
44
description: "Learn how to implement server binding in the Telerik UI ComboBox HtmlHelper for {{ site.framework }}."
55
previous_url: /helpers/editors/combobox/binding/server-binding
66
slug: htmlhelpers_combobox_serverbinding_aspnetcore
7-
position: 3
7+
position: 4
88
---
99

1010
# Server Binding

docs-aspnet/html-helpers/editors/combobox/binding/todatasourceresult-binding.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ page_title: Custom Data Binding
44
description: "Learn how to implement custom ToDataSourceResult data binding in the Telerik UI ComboBox HtmlHelper for {{ site.framework }}."
55
previous_url: /helpers/editors/combobox/binding/custom-binding
66
slug: htmlhelpers_combobox_todatasourceresultbinding_aspnetcore
7-
position: 4
7+
position: 5
88
---
99

1010
# Custom Data Binding
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
---
2+
title: Razor Page
3+
page_title: Configure a DataSource for the DropDownTree for Remote Binding in Razor Page.
4+
description: "An example on how to configure the remote binding DataSource to populate the Telerik UI DropDownTree HtmlHelper for {{ site.framework }} in a Razor Page using CRUD Operations."
5+
slug: htmlhelpers_dropdowntree_razorpage_aspnetcore
6+
position: 3
7+
---
8+
9+
# Razor Page
10+
11+
# DropDownTree Remote Data Binding in Razor Pages
12+
13+
This article describes how to configure a Remote DataSource of a Telerik DropDownTree in a RazorPage scenario.
14+
15+
In order to set up the ComboBox component bindings, you need to configure the `Read` method of its `DataSource` instance. The URL in this method should refer the name of the method in the PageModel. In this method, you can also pass additional parameters, such as filter string and antiforgery token (see `dataFunction`). See the implementation details in the example below, and for the full project with RazorPages examples, visit our [GitHub repository](https://github.com/telerik/ui-for-aspnet-core-examples/tree/master/Telerik.Examples.RazorPages).
16+
17+
```tab-RazorPage(csthml)
18+
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
19+
@Html.AntiForgeryToken()
20+
21+
@(Html.Kendo().DropDownTree()
22+
.Name("dropdowntree")
23+
.AutoWidth(true)
24+
.DataTextField("Name")
25+
.HtmlAttributes(new { style = "width: 100%" })
26+
.CheckAll(true)
27+
.AutoClose(false)
28+
.Checkboxes(checkboxes => checkboxes
29+
.CheckChildren(true)
30+
)
31+
.DataSource(dataSource => dataSource
32+
.Custom()
33+
.Transport(t => t
34+
.Read(r => r.Url(Url.Page("DropDownTreeIndex", "DropDownTreeRead")).Data("forgeryToken")))
35+
)
36+
37+
)
38+
39+
<script>
40+
function forgeryToken() {
41+
return kendo.antiForgeryTokens();
42+
}
43+
</script>
44+
```
45+
```tab-PageModel(cshtml.cs)
46+
47+
public JsonResult OnGetDropDownTreeRead(int? id)
48+
{
49+
var data = dbContext.Where(x => id.HasValue ? x.ParentID == id : x.ParentID == null)
50+
.Select(item => new {
51+
id = item.ID,
52+
Name = item.Name,
53+
hasChildren = item.HasChildren
54+
});
55+
56+
return new JsonResult(data);
57+
}
58+
```
59+
60+
## See Also
61+
62+
* [Razor Pages Support]({% slug razor_pages_integration_aspnetmvc6_aspnetmvc %})
63+
* [DataBinding Overview]({% slug htmlhelpers_combobox_databinding_aspnetcore %})
64+

docs-aspnet/html-helpers/editors/dropdowntree/binding/server-binding.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ title: Server Binding
33
page_title: Server Binding
44
description: "Learn how to implement server binding in the Telerik UI DropDownTree HtmlHelper for {{ site.framework }}."
55
slug: htmlhelpers_dropdowntree_serverbinding_aspnetcore
6-
position: 3
6+
position: 4
77
---
88

99
# Server Binding

docs-aspnet/html-helpers/editors/multicolumncombobox/binding/custom-binding.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ page_title: Custom Binding
44
description: "Learn how to implement custom binding with Telerik UI MultiColumnComboBox HtmlHelper for {{ site.framework }}."
55
previous_url: /helpers/editors/multicolumncombobox/binding/custom-binding
66
slug: custombinding_multicolumncombobox_aspnetmvc
7-
position: 4
7+
position: 5
88
---
99

1010
# Custom Binding

docs-aspnet/html-helpers/editors/multicolumncombobox/binding/model-binding.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ page_title: Model Binding
44
description: "Learn how to implement model binding with Telerik UI MultiColumnComboBox HtmlHelper for {{ site.framework }}."
55
previous_url: /helpers/editors/multicolumncombobox/binding/model-binding
66
slug: modelbinding_multicolumncombobox_aspnetmvc
7-
position: 5
7+
position: 6
88
---
99

1010
# Model Binding

0 commit comments

Comments
 (0)