Progress® Telerik® UI for Blazor Feedback Portal
Back to Feed
Request a Feature Report a Bug
Declined
Last Updated: 09 Apr 2024 09:32 by ADMIN
Kacper
Created on: 02 Apr 2024 21:51
Category: UI for Blazor
Type: Bug Report
0
LoadGroupsOnDemand

Hi,
I have a little problem with changing the LoadGroupsOnDemand value. Depending on the data in my grid, I set this value to true or false. When updating grid data requires changing the LoadGroupsOnDemand value, I can't do it this way:

LoadGroupsOnDemand = true;
GridData = result;
GridRef.SetStateAsync(GridRef.GetState());

This code throws me an exception.
I need to do something like this to make it work:

LoadGroupsOnDemand = true;
GridRef.LoadGroupsOnDemand = LoadGroupsOnDemand;
GridData = result;
GridRef.SetStateAsync(GridRef.GetState());

This is the code that is executed in onclick. After OnRead is executed, the exception is thrown.

Let me know if you need more information.

1 comment
ADMIN
Dimo
Posted on: 09 Apr 2024 09:32

Hello Kacper,

The correct way to switch the Grid group mode is to change the value of the LoadGroupsOnDemand parameter and then Rebind() the Grid.

On the other hand, this line...

GridRef.LoadGroupsOnDemand = LoadGroupsOnDemand;

...represents the so-called direct component mutation and it's not correct in Blazor.

Here is as working example. I will add it to our Grid Load Groups on Demand documentation shortly.

@using Telerik.DataSource

<label>
    <TelerikCheckBox Value="@GridLoadGroupsOnDemand"
                     ValueChanged="@GridLoadGroupsOnDemandChanged"
                     TValue="@bool" /> Load Groups On Demand
</label>

<TelerikGrid @ref="@GridRef"
             Data="@GridData"
             Pageable="true"
             Sortable="true"
             Groupable="true"
             LoadGroupsOnDemand="@GridLoadGroupsOnDemand"
             FilterMode="GridFilterMode.FilterRow"
             OnStateInit="@( (GridStateEventArgs<Employee> args) => OnGridStateInit(args) )">
    <GridColumns>
        <GridColumn Field="@nameof(Employee.Name)" />
        <GridColumn Field="@nameof(Employee.Team)" />
        <GridColumn Field="@nameof(Employee.Salary)" />
        <GridColumn Field="@nameof(Employee.OnVacation)" />
    </GridColumns>
</TelerikGrid>

@code {
    private TelerikGrid<Employee>? GridRef { get; set; }
    private List<Employee> GridData { get; set; } = new();

    private bool GridLoadGroupsOnDemand { get; set; }

    private void GridLoadGroupsOnDemandChanged(bool newValue)
    {
        GridLoadGroupsOnDemand = newValue;

        GridRef?.Rebind();
    }

    private void OnGridStateInit(GridStateEventArgs<Employee> args)
    {
        args.GridState.GroupDescriptors = new List<GroupDescriptor>();

        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; }
    }
}

 

Regards,
Dimo
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources!
Create an account Log In
View
Type
Status
Category