TreeGrid does not refresh when data is updated

Good morning,

I have a bunch of data that I would like to show in a TreeGrid. A separate thread updates some properties of the data. When this happens, I would like the TreeGrid to refresh in order to show the updated properties.

Unfortunately, I cannot make it work. I tried several approaches and I built a minimal working example based on a similar thread that I found on this forum. I uploaded the file here since the upload on the thread wouldn't work.

As you can see, when you click the "Update" button a new thread starts and it updates the data bound to the TreeGrid every 100 ms:


public void UpdateRecord()
    {
        Thread printer = new Thread(new ThreadStart(InvokeMethod));
        printer.Start();
    }


    public void InvokeMethod()
    {
        while (true)
        {
            ChangeData();
            Debug.WriteLine("Changed data!");
            Thread.Sleep(100);
        }
    }

public void ChangeData()
    {
        Random rand = new Random();
        for (var i = 0; i < TreeData.Count(); i++)
        {
            if (TreeData.Count() != 0)
            {
                int index = rand.Next(ObservableDataNew.Count());
                var name = TreeData[i];
                name.CustomerID = ObservableDataNew[index].CustomerID;
                name.Freight = ObservableDataNew[index].Freight;
                name.ShipName = ObservableDataNew[index].ShipName;
                name.ShipCountry = ObservableDataNew[index].ShipCountry;
            }
        }
        InvokeAsync(StateHasChanged);
        InvokeAsync(OrdersTreeGrid.RefreshAsync);
    }

Despite the fact that a spinner appears on the table, the data that it shows remain the same. How can I fix this?


11 Replies

FS Farveen Sulthana Thameeztheen Basha Syncfusion Team October 14, 2021 04:00 PM UTC

Hi Alsessandro, 

Greetings from Syncfusion Support. 

Query#:- Despite the fact that a spinner appears on the table, the data that it shows remain the same. How can I fix this? 

We have checked your query and we have prepared sample in TreeGrid as like your provided code example but we are unable to replicate the problem at our end  “Data has been changed on clicking updateRecord”. Refer to the below sample and Video demo:- 

Video Demo:-  

We need some more additional details to find the cause of the issue. Share us the following details. 

  1. Complete TreeGrid code example.
  2. Video demo to replicate the problem.
  3. If possible replicate it in the above sample and revert us back.

The provided details will be helpful to provide you solution as early as possible. 

Regards, 
Farveen sulthana T 



AC Alessandro Chillemi October 19, 2021 10:04 AM UTC

Thanks for the reply. The sample you provided uses the NuGet package Syncfusion.Blazor 18.0.2.48. If you update to the latest version, i.e. Syncfusion.Blazor 19.3.0.46, the problem will show up in your sample too. I'm attaching the code.


Attachment: blazor_samplebysyncfusion_4924d7cd.zip


BV Bram van Elderen October 20, 2021 10:02 AM UTC

I'm having the same problem. I'm using AddRecordAsync to update the data in the grid but nothing happens. Also 19.3.0.46. And also tested it on 18 on which it does indeed work fine.



FS Farveen Sulthana Thameeztheen Basha Syncfusion Team October 20, 2021 03:05 PM UTC

Hi Alessandro/Bram, 

We are working on your reported problem with high Priority and update you further details by on or before 22nd October 2021. In the meanwhile we will contact you if any details required. 

Regards, 
Farveen sulthana T 



FS Farveen Sulthana Thameeztheen Basha Syncfusion Team October 22, 2021 04:22 PM UTC

Hi Alessandro/Bram,  

We appreciate your patience. 

Query#:- If you update to the latest version, i.e. Syncfusion.Blazor 19.3.0.46, the problem will show up in your sample too. 
 
We are able to replicate the problem at Latest version. We will validate the reported problem at our end(with using Observable collections) and provide you further details 25th October 2021. 

Query#:- I'm using AddRecordAsync to update the data in the grid but nothing happens. 
 
We have checked your reported problem by preparing sample with AddRecordAsync but we are unable to replicate the problem at our end. Refer to the below code:- 

<SfButton ID="update" @onclick="OnClick">Update Data</SfButton> 
    <SfTreeGrid @ref=TreeGrid DataSource="@TreeData" IdMapping="TaskId" ParentIdMapping="ParentId" TreeColumnIndex="1"> 
        <TreeGridEditSettings AllowEditing="true" AllowAdding="true" AllowDeleting="true" /> 
        <TreeGridColumns> 
            <TreeGridColumn Field="TaskId" HeaderText="Task ID" Width="80" IsPrimaryKey="true" TextAlign="Syncfusion.Blazor.Grids.TextAlign.Right"></TreeGridColumn> 
 
            .     .   . 
        </TreeGridColumns> 
    </SfTreeGrid> 
 
    @code{ 
 
 
        private async Task OnClick() 
        { 
            var newRecord = new BusinessObject() { TaskId = 10, TaskName = "Child Task 10", Duration = 7, Progress = 70, Priority = "Low" }; 
            await TreeGrid.SelectRowAsync(6); 
            await TreeGrid.AddRecordAsync(newRecord, 6, RowPosition.Child); 
             
        } 
    } 

Using RowPosition as Child we have added new record as Child for the particular parent record. Refer to the sample Link:- 

So we need some more additional details to find the cause of the issue. Share us the following details. 

  1. Complete TreeGrid code example.
  2. Exact scenario you have faced the issue.
  3. Have you faced any Exception while adding the record. If yes please share.
  4. If possible replicate it in the above sample and revert us back.

Regards, 
Farveen sulthana T 





BV Bram van Elderen October 25, 2021 08:57 AM UTC

Hello Farveen,


Sorry was indeed a different issue i was having. Your example solved mine. thanks



FS Farveen Sulthana Thameeztheen Basha Syncfusion Team October 25, 2021 04:09 PM UTC

Hi Bram, 

Query#:- Sorry was indeed a different issue i was having. Your example solved mine. Thanks 
 
Thanks for your update. Please get back to us if you need any further assistance. We are happy to assist you. 

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 

Hi Alessandro, 

We appreciate your patience. 

Query#:- TreeGrid does not refresh when data is updated. If you update to the latest version, i.e. Syncfusion.Blazor 19.3.0.46, the problem will show up in your sample too.  

Further analyzing, we have confirmed this issue “TreeGrid doesn’t refresh when we update the data using Observable collections” as Bug at our end. Thank you for the taking the time to report the issue and helping us improve our product. At Syncfusion we are committed to fixing all the validated defect (subject to technological feasibility and Product Development Life Cycle) and including its fix in our subsequent release.  The fix for the issue will be included in second week patch release of November 2021(which is expected to be 10th November).  

You can track the current status of your request, review the resolution timeline and contact us for any further inquiries through this link.       
 
Note: To view the above feedback, kindly login into your account.   
 
Regards, 
Farveen sulthana T 



FS Farveen Sulthana Thameeztheen Basha Syncfusion Team November 10, 2021 12:59 PM UTC

  
Hi Bram,  

The reported issue will be included in our Volume 3, SP release which will be expected to roll out at November 12, 2021. We doesn’t have patch release for this week because of SP release. 

Regards, 
Farveen sulthana T 



FS Farveen Sulthana Thameeztheen Basha Syncfusion Team November 12, 2021 01:13 PM UTC

Hi Alessandro, 
 
We are glad to announce that our Essential Studio 2021 Volume 3 SP release v19.3.0.53  is rolled out and is available for download under the following link. 
 
Fix for the issue “TreeGrid doesn’t refresh when we update the data using Observable collections” has been included in this release. 
 
Note:- There is no need to use StateHasChanged method to re-render after updating the data on updating the data. 
 
We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 
 
 Regards, 
Farveen sulthana T 
 



AC Alessandro Chillemi replied to Farveen Sulthana Thameeztheen Basha November 24, 2021 08:33 AM UTC

Thank you for the update.


Regarding this note:

 Note:- There is no need to use StateHasChanged method to re-render after updating the data on updating the data. 

I tried to run the same sample that I uploaded here without the StateHasChanged call (line 144 of Index.razor), but it doesn't work. Is this normal?



FS Farveen Sulthana Thameeztheen Basha Syncfusion Team November 25, 2021 03:49 PM UTC

Hi Alessandro, 

In the attached sample, you have performed customizations and need to call Invokemethod recursively to update the changes dynamically within certain time Interval. So for that use case, you can use StateHasChanged method to update the changes in your attached sample. 

But in General from previous context we states that there is no need to use StateHasChanged to re-render the TreeGrid to update the changes while using ObservableCollection. In the attached sample also when we click UpdateData, it will change the data for once without StateHasChanged. 

Please get back to us if you need any further assistance. 

Regards, 
Farveen sulthana T 


Loader.
Up arrow icon