SfGrid - Child list items bound datasource details not matching what is displayed in view

Hi, I'm dealing with an issue using the Syncfusion SfGrid.  I have a Blazor component that contains the SfGrid and what is happening is that whenever updates happen to list items within the bound data source it does not reflect properly with what is displayed on the ui.

For example ...

  <EpGrid ID="CostCenters" @ref="_epGrid" DataSource="@_model.CostCenters" TValue="CostCenterGetListItemVm" Toolbar="@_toolbaritems">

.....

 <GridColumn Field="@nameof(CostCenterGetListItemVm.Accounts)" HeaderText="Accounts">

     <Template>

         @{

             var costCenter = context as CostCenterGetListItemVm;


             @if (costCenter.Accounts.Any())

             {

                 <SfButton Content="View" OnClick="@(args => OpenAccountsDialog(costCenter))"></SfButton>

             }

         }

     </Template>

 </GridColumn>

...

</EpGrid>


I've bolded the two spots where I am looking at Accounts for a Cost Center.  The first bold has changes with the data with what I expect the view should be.  So for instance say I add 1 account to a Cost Center that was empty the datasource of the bound model shows as expected.  However, when I inspect the  

@if (costCenter.Accounts.Any())

block of code it doesn't reflect the changes shows no accounts for the cost center.

Can you point out what this could possibly be?

I've attached the related code files for more details.  Thanks.


​




Attachment: Syncfusion_d9fbb25b.zip

1 Reply

PS Prathap Senthil Syncfusion Team September 12, 2024 03:07 PM UTC

Hi Jun Allan ,


Based on the reported problem, we suspect that the issue you’re facing is that changes made to the list items within the bound data source of the Syncfusion SfGrid are not reflecting properly in the UI. You can resolve this by using the grid's Refresh() method to refresh the grid and rebind the list of data. Kindly refer to the code snippet and sample below for your reference.

Index.Razor page

public async Task LoadData()

{

     GridData = OrderData.GetAllRecords();

     DataGridRef.RefreshGrid();

}

CustomGrid.Razor.cs

using Microsoft.AspNetCore.Components;

using Syncfusion.Blazor.Grids;

 

namespace BlazorApp1.Pages

{

    public partial class CustomGrid<TValue> : SfGrid<TValue>

    {

        public const int PAGE_COUNT = 5;

        public const int DEFAULT_PAGE_SIZE = 10;

        public string[] PageSizes = new string[] { "10", "20", "50" };

        IReadOnlyDictionary<string, object> props { get; set; }

 

        public SfGrid<TValue> grid { get; set; }

        public async Task RefreshGrid()

        {

            await this.grid.Refresh();

        }

    }

}

 

Reference: https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.SfGrid-1.html#Syncfusion_Blazor_Grids_SfGrid_1_Refresh

If issue persists, we request you to share the following details to us.


  1. To help us address the reported problem, please share a reproducible simple sample with duplicate data or your attempt to replicate the issue using the attached simple sample.
  2. Please share with us the video demonstration of the issue you have faced.
  3. Could you please share with us the NuGet version you have used?


Above-requested details will be very helpful in validating the reported query at our end and providing a solution as early as possible. Thanks for your understanding.


Regards,
Prathap Senthil


Attachment: CustomGrid_548a95b.zip

Loader.
Up arrow icon