DataGrid refresh on Reload/LoadData

[nicoma]

Hi,

I am currently faced with something I would consider to be a bug:
I have a DataGrid which get's its data assigned in the LoadData event. Everything starts to work out, if I additionally set the data count attribute in the event.
However, I am unable to reload the data through e.g. a button click. I have changed the data on the backend database, but this is not reflected in the data grid. Additionally, when I enter a new record and click my button, I get the newly created record from the backend, but the changes of previous ones are not considered. For me, this means there is too much data cached and not renewed.

Do you agree?

[enchev]

If you need to reload the DataGrid component you can execute Reload() method.

[nicoma]

That's what I am doing, but the grid is not reflecting changes from the backend when I click my button:

[nicoma]

I did some additional analysis.
Apparently, new records are added to the datagrid if I create them on the backend and press the refresh button. Still, changes to already cached records are not updated.

I even implemented some sort of redirects which are not resulting in a refreshed cache. Any suggestions?

[korchev]

Are you sure the data is updated? You can use the Visual Studio debugger to verify what data is being set to the Data property of the Radzen DataGrid.

[nicoma]

Can you tell me how this is done? I can tell you that requests are sent to the database. I can see the statements being print.

Btw: I created a new application and the exact same code works in there. Question is how I can fix my already existing one?

[Crowmmark]

I have the same issue as well. I have a grid that I refresh on a timer that updates the grid data data source. Only add and deleted records refresh. Eventually after enough time goes by the records will get updated. If I edit a row through an edit dialog the row is updated correctly but not if it’s changed outside of the application. I have confirmed the data is showing the change when debugging but it’s as if the grid doesn’t know that a value has changed.

[enchev]

Try to execute Reload() method of the DataGrid.

[Crowmmark]

So I did some more testing and looked at the data. The grid data is not showing the correct data unless there is a new record added or a recorded removed. I have debugged the grid load event and it is not getting the current data for records already bound to the grid. I am getting the data in the gridload event and have a timer that calls the grid0.reload() method every 10 seconds.

Here is the grid loaddata event:
protected async System.Threading.Tasks.Task Grid0LoadData(LoadDataArgs args)
{
myTicketsGridEvent = args;

        myTicketsGridBaseFilter = "";

        myTicketsGridBaseFilter = "StatusTypeId != 5 && (AssignedToName == \"" + Security.User.Name + "\" || SecondaryAssignedToName.Contains(\"" + Security.User.Name + "\"))";

        if (string.IsNullOrEmpty(myTicketsGridEvent.Filter)) {
            myTicketsGridFilter = myTicketsGridBaseFilter;
        }

        if (!string.IsNullOrEmpty(myTicketsGridEvent.Filter)) {
            myTicketsGridFilter = myTicketsGridEvent.Filter + " && " + myTicketsGridBaseFilter;
        }

        myTicketsSortDefault = "LastActivityDateTime asc";

        myTicketsSort = myTicketsSortDefault;

        if (!string.IsNullOrEmpty(myTicketsGridEvent.OrderBy)) {
            myTicketsSort = myTicketsGridEvent.OrderBy;
        }

        try
        {
            var crownCrmDbGetTicketsResult = await CrownCrmDb.GetTickets(new Query() { Filter = $@"{myTicketsGridFilter}", OrderBy = $"{myTicketsSort}", Expand = "Tasks,Projects" });
            getMyTicketsResult = crownCrmDbGetTicketsResult;

            getMyTicketsResultCount = crownCrmDbGetTicketsResult.Count();
        }
        catch (Exception crownCrmDbGetTicketsException)
        {
                NotificationService.Notify(NotificationSeverity.Error, $"Error", $"{crownCrmDbGetTicketsException}", 5000);
        }
    }

And here is the timer elapsed event:
private async void Timer_Elapsed(object sender, ElapsedEventArgs e)
{
await InvokeAsync(() =>
{
try
{
Console.WriteLine("grid0.Reload() and grid1.Reload() starting");
try
{
grid0.Reload();

                }
                catch (Exception crownCrmDbGetTicketsException012)
                {
                    NotificationService.Notify(NotificationSeverity.Error, $"Error", $"{crownCrmDbGetTicketsException012}", 5000);
                }

                timerRefreshResult = DateTime.Now.ToString();

            }
            catch (Exception ex)
            {
                Console.WriteLine("Error:  " + ex.Message);
            }

            this.StateHasChanged();
            
        });
        
    }

[enchev]

Can you post the DataGrid razor declaration also?

[Crowmmark]

Sure. I had issues posting the razor so I attached it as a zip.
MyDashboard.zip (3.3 KB)

[enchev]

Not sure why is not working for you. I've modified this demo with the following code and the LoadData method is called every 5 sec:

@code {
    int count;
    IEnumerable<Employee> employees;

    RadzenGrid<Employee> grid;

    protected override void OnInitialized()
    {
        base.OnInitialized();

        Timer timer = new Timer(5000);
        timer.Elapsed += (s,e)=> { InvokeAsync(grid.Reload); };
        timer.Start();
    }

    async Task LoadData(LoadDataArgs args)
    {
        var result = await service.GetEmployees(filter: args.Filter, top: args.Top, skip: args.Skip, orderby: args.OrderBy, count: true);
        employees = result.Value.AsODataEnumerable();
        count = result.Count;

        StateHasChanged();
    }
}

[nicoma]

Have you checked data changes that you did to the backend meanwhile your page refreshing?

To me, it looks like the whole loaddata event has caching which prevents some functionalities.
For example the pagination does not work for me too when using the load data event.
Grid is showing the pages, but the pagesize is not considered and all records are presented.

[Sam]

This issue does not appear to be resolved and I'm dealing with the exact same problem. Edits do not appear in the grid unless I refresh the page (F5 or programmatically refresh). Adds and Deletes will appear, I can even insert a new record via SQL insert before clicking Save on an Edit operation - the new record will appear, but the changes do not. Clicking "Edit" on the same record will show the recent edits in edit window, but clicking "Save" will not show the edits on the grid.
I'm subscribing to the Dialog.Close() event, and calling Grid.Reload() in there.
The most ridiculous thing is that this same code works on another project without issue. Why will it not work here?

[Isaac]

Hi all,
I have very similar issue. All CRUD operations work just fine (the changes appear in my database) but the datagrid only shows the CRUD changes after manually refreshing the page. I invoke a simple "await grid.Reload()" after any CRUD method, but it seems as if the reload() method does not do anything. I already tried a few things to try to get it to work, but without success.
Do I need something else besides the "await grid.Reload()" to get it to work?

[enchev]

Reload() method of the DataGrid will just rebuild the component UI using the value provided in Data property. If you use a service to retrieve your data you might need to to request it.

[Isaac]

Okay, that makes sense. Thanks for the fast reply!

[bjrichardson999]

I can corroborate that there are indeed cases where the LoadData method is called, but the grid doesn't reflect the data that was loaded, even if StateHasChanged() was called. I put some logging into the Blazor side, and I can see that while the Render event is triggered, the grid itself is not re-rendered. I find that the following workaround will do what you want it to do:

_myData = null
_myDataGrid.Reload();

The DataGrid will not re-render for some reason until the _myData property has been changed.

[Saadi]

Didn't worked for me ... am I missing something ??

[Jean-Sebastien_Petit]

I know this is an old post, but I have the same issue:
My Grid is as follow:

                        <RadzenDataGrid style="height: 235px" @ref="logGrid" IsLoading=@isLogLoading Count="@logCount" Data="@logs" LoadData="@LoadLogData" AllowSorting="false" AllowFiltering="false" AllowPaging="false" TItem="LogSummary" ColumnWidth="200px">
                            <Columns>
                                <RadzenDataGridColumn TItem="LogSummary" Property="Description"  Filterable="false" Title="Description" Width="240px" TextAlign="TextAlign.Left" />
                                <RadzenDataGridColumn TItem="LogSummary" Property="CreatedOn"  Filterable="false" Title="Created On" Width="120px" TextAlign="TextAlign.Center" />
                            </Columns>
                        </RadzenDataGrid>

The corresponding backend element:

        protected RadzenDataGrid<LogSummary> logGrid;
        protected IEnumerable<LogSummary> logs;
        protected int logCount;
        protected bool isLogLoading;

        private void Listener_TableChanged(object sender, SqlDependencyEx.TableChangedEventArgs e)
        {
            logs = null;
            logGrid.Reload();
            StateHasChanged();
        }

        protected async Task LoadLogData(LoadDataArgs args)
        {
            isLogLoading = true;

            await Task.Yield();

            var query = ExtractDataSvc.Logs.OrderByDescending(l => l.CreatedOn).Take(25);

            logCount = query.Count();
            logs = query.Select(l => new LogSummary { Description  = l.Description, CreatedOn = l.CreatedOn }).ToList();            
            isLogLoading = false;
            
        }

I add a new row in the source DB, and the event is triggered

Facts:

• The event is trigggered
• LoadData calls LoadLogData
• logs list contains the new data
• Grid is not refreshed.

Any ideas would be welcome.