Skip to content

Commit d7f6d93

Browse files
kendo-botkendo-bot
committed
Sync with Kendo UI Professional
1 parent c91e9a8 commit d7f6d93

File tree

2 files changed

+47
-29
lines changed

2 files changed

+47
-29
lines changed

‎docs-aspnet/html-helpers/data-management/grid/appearance/adaptive-tools.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ slug: adaptive_tools_gridhelper_aspnetcore
66
position: 6
77
---
88

9-
# Adaptive Tools
9+
# ToolBar Adaptive Tools
1010

1111
The Telerik UI Grid for {{ site.framework }} supports rendering selected toolbar tools in adaptive mode starting with version Q2 2025. This feature improves usability on smaller screens by displaying sorting, filtering, grouping, and editing UI elements in a mobile-friendly ActionSheet.
1212

@@ -453,6 +453,6 @@ To delete a specified record, the user must first select the row, then click the
453453
## See Also
454454

455455
* [{{ site.framework }} Grid Overview](https://www.telerik.com/{{ site.platform }}/grid)
456-
* [Adaptive Tools Demo](https://demos.telerik.com/{{ site.platform }}/grid/adaptive-tools)
457-
* [Adaptive Tools Editing Demo](https://demos.telerik.com/{{ site.platform }}/grid/adaptive-tools-editing)
456+
* [Adaptive Tools Demo](https://demos.telerik.com/{{ site.platform }}/grid/toolbar-tools)
457+
* [Adaptive Tools Editing Demo](https://demos.telerik.com/{{ site.platform }}/grid/toolbar-editing)
458458
* [Server-Side API](/api/grid)

‎docs-aspnet/html-helpers/data-management/grid/toolbar.md‎

Lines changed: 44 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ slug: htmlhelpers_grid_aspnetcore_toolbar
66
position: 15
77
---
88

9-
# Toolbar
9+
# ToolBar Adaptive Tools
1010

1111
The [`ToolBar()`](/api/kendo.mvc.ui.fluent/gridtoolbarcommandfactory) configuration option of the Grid allows you to add command buttons and allow the user to invoke built-in Grid functionalities. You can also define custom commands or use templates to customize the Toolbar of the {{ site.product }} Grid.
1212

@@ -79,6 +79,9 @@ In the 2025 Q2 release an alternative way to configure the tools has been implem
7979
| Search | Adds the built-in search panel for the Grid.| [Search Panel documentation]({% slug htmlhelpers_grid_aspnetcore_searchpanel %})|
8080
| Spacer | Moves the tools that are declared after it to the right side of the ToolBar.| |
8181
| Separator | Acts as a delimiter between the ToolBar commands.| |
82+
| Group | Allows grouping the data from the ToolBar tool. | [Grouping tool documentation]({% slug adaptive_tools_gridhelper_aspnetcore %}#grouping) |
83+
| Sort | Displays a sort tool. | [Sorting tool documentation]({% slug adaptive_tools_gridhelper_aspnetcore %}#sorting) |
84+
| Filter | Allows column filtering from the ToolBar tool. | [Filtering tool documentation]({% slug adaptive_tools_gridhelper_aspnetcore %}#filtering) |
8285

8386
### Overflow
8487

@@ -89,15 +92,20 @@ The following example demonstrates how to modify the default overflow settings o
8992
```Razor
9093
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
9194
.Name("grid")
92-
.ToolBar(t => t.Items(item =>
93-
{
94-
item.Pdf();
95-
item.Excel();
96-
item.Custom().Text("Custom Button 1");
97-
item.Custom().Text("Custom Button 2");
98-
item.Custom().Text("Custom Button 3");
99-
item.Search();
100-
})
95+
.ToolBar(toolbar => toolbar
96+
.Items(itm =>
97+
{
98+
itm.Create();
99+
itm.Edit();
100+
itm.Destroy();
101+
itm.Separator();
102+
itm.Filter();
103+
itm.Sort();
104+
itm.Group();
105+
itm.Spacer();
106+
itm.ColumnChooser();
107+
})
108+
)
101109
.Overflow(o => o
102110
.Mode(ToolBarOverflowMode.Scroll)
103111
.ScrollButtons(ScrollButtonsType.Auto)
@@ -111,13 +119,15 @@ The following example demonstrates how to modify the default overflow settings o
111119
```TagHelper
112120
<kendo-grid name="grid">
113121
<toolbar>
114-
<toolbar-button name="pdf"></toolbar-button>
115-
<toolbar-button name="excel"></toolbar-button>
116-
<toolbar-button name="custom" text="Custom Button 1"></toolbar-button>
117-
<toolbar-button name="custom" text="Custom Button 2"></toolbar-button>
118-
<toolbar-button name="custom" text="Custom Button 3"></toolbar-button>
119-
<toolbar-button name="Search"></toolbar-button>
120-
<overflow mode="ToolBarOverflowMode.Scroll" scroll-buttons="ScrollButtonsType.Auto" scroll-buttons-position="ScrollButtonsPositionType.Start" scroll-distance="50" />
122+
<toolbar-button name="create"></toolbar-button>
123+
<toolbar-button name="edit"></toolbar-button>
124+
<toolbar-button name="destroy"></toolbar-button>
125+
<toolbar-button name="separator"></toolbar-button>
126+
<toolbar-button name="filter"></toolbar-button>
127+
<toolbar-button name="sort"></toolbar-button>
128+
<toolbar-button name="group"></toolbar-button>
129+
<toolbar-button name="spacer" type="spacer" />
130+
<toolbar-button name="columnChooser"></toolbar-button>
121131
</toolbar>
122132
<!-- Additional configuration. -->
123133
</kendo-grid>
@@ -143,11 +153,17 @@ The following example demonstrates how to add a custom command to the Toolbar:
143153
columns.Command(command => command.Destroy()).Width(150);
144154
})
145155
.ToolBar(toolbar =>toolbar
146-
.Items(itm=>{
156+
.Items(itm =>
157+
{
147158
itm.Create();
148159
itm.Edit();
149-
itm.Save();
150-
itm.CancelEdit();
160+
itm.Destroy();
161+
itm.Separator();
162+
itm.Filter();
163+
itm.Sort();
164+
itm.Group();
165+
itm.Spacer();
166+
itm.ColumnChooser();
151167
})
152168
.ShowInactiveTools(true)
153169
.Overflow(overflow => overflow
@@ -164,14 +180,16 @@ The following example demonstrates how to add a custom command to the Toolbar:
164180
{% if site.core %}
165181
```TagHelper
166182
<kendo-grid name="grid">
167-
<toolbar show-inactive-tools="true">
168-
<overflow mode=ToolBarOverflowMode.Scroll
169-
scroll-buttons=ScrollButtonsType.Visible
170-
scroll-buttons-position=ScrollButtonsPositionType.Split/>
183+
<toolbar show-inactive-tools="false">
171184
<toolbar-button name="create"></toolbar-button>
172185
<toolbar-button name="edit"></toolbar-button>
173-
<toolbar-button name="save"></toolbar-button>
174-
<toolbar-button name="cancelEdit"></toolbar-button>
186+
<toolbar-button name="destroy"></toolbar-button>
187+
<toolbar-button name="separator"></toolbar-button>
188+
<toolbar-button name="filter"></toolbar-button>
189+
<toolbar-button name="sort"></toolbar-button>
190+
<toolbar-button name="group"></toolbar-button>
191+
<toolbar-button name="spacer" type="spacer" />
192+
<toolbar-button name="columnChooser"></toolbar-button>
175193
</toolbar>
176194
<editable mode="incell"/>
177195
</kendo-grid>

0 commit comments

Comments
 (0)