From cd03478f068e37c9e11d392ba848400e5503a718 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
<41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 9 Apr 2024 13:40:11 +0300
Subject: [PATCH] docs(grid): Show how to toggle LoadGroupsOnDemand (#2028)
Co-authored-by: Dimo Dimov <961014+dimodi@users.noreply.github.com>
---
components/grid/grouping/load-on-demand.md | 98 +++++++++++++++++++++-
1 file changed, 95 insertions(+), 3 deletions(-)
diff --git a/components/grid/grouping/load-on-demand.md b/components/grid/grouping/load-on-demand.md
index 76ae68e51..fa229fc23 100644
--- a/components/grid/grouping/load-on-demand.md
+++ b/components/grid/grouping/load-on-demand.md
@@ -19,6 +19,7 @@ In this article:
* [Examples](#examples)
* [Regular Paging and Group Load On Demand](#regular-paging-and-group-load-on-demand)
* [Virtual Scrolling, Group Load On Demand and Server Data Operations](#virtual-scrolling-group-load-on-demand-and-server-side-data-operations)
+ * [Toggle Group Load Mode at Runtime](#toggle-group-load-mode-at-runtime)
* [Limitations](#limitations)
## Basics
@@ -263,6 +264,98 @@ Scroll through the groups or expand them to load their data on demand
````
+### Toggle Group Load Mode at Runtime
+
+To toggle how the Grid loads groups:
+
+1. [Obtain reference to the Grid instance with `@ref`]({%slug grid-overview%}#grid-reference-and-methods).
+1. Change the `LoadGroupsOnDemand` parameter value.
+1. [Rebind()]({%slug common-features-data-binding-overview%}#refresh-data) the Grid.
+
+>caption Switch the Grid group load mode
+
+````CSHTML
+@using Telerik.DataSource
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+@code {
+ private TelerikGrid? GridRef { get; set; }
+
+ private List GridData { get; set; } = new();
+
+ private bool GridLoadGroupsOnDemand { get; set; }
+
+ private void GridLoadGroupsOnDemandChanged(bool newValue)
+ {
+ GridLoadGroupsOnDemand = newValue;
+
+ GridRef?.Rebind();
+ }
+
+ private void OnGridStateInit(GridStateEventArgs args)
+ {
+ args.GridState.GroupDescriptors = new List();
+
+ args.GridState.GroupDescriptors.Add(new GroupDescriptor()
+ {
+ Member = nameof(Employee.Team),
+ MemberType = typeof(string)
+ });
+ }
+
+ protected override void OnInitialized()
+ {
+ var rnd = new Random();
+
+ for (int i = 1; i <= 20; i++)
+ {
+ GridData.Add(new Employee()
+ {
+ Id = i,
+ Name = "Name " + i,
+ Team = "Team " + (i % 4 + 1),
+ Salary = (decimal)rnd.Next(1000, 3000),
+ OnVacation = i % 3 == 0
+ });
+ }
+ }
+
+ public class Employee
+ {
+ public int Id { get; set; }
+ public string Name { get; set; } = string.Empty;
+ public string Team { get; set; } = string.Empty;
+ public decimal Salary { get; set; }
+ public bool OnVacation { get; set; }
+ }
+}
+````
+
+
## Limitations
* The expanded state of the groups is preserved during paging only, but not if sorting or filtering is applied.
@@ -277,8 +370,7 @@ Scroll through the groups or expand them to load their data on demand
* When exporting only the current Grid page (`AllPages="false"`), the exported file will not contain child data for collapsed groups.
+
## See Also
- * [Live Demo: Grid Group Load On Demand](https://demos.telerik.com/blazor-ui/grid/group-loadondemand)
-
-
+* [Live Demo: Grid Group Load On Demand](https://demos.telerik.com/blazor-ui/grid/group-loadondemand)