1. Home
  2. Forum
  3. Blazor
  4. Refresh grid after updating database on a different page

Refresh grid after updating database on a different page

I have a grid that has a IEnumerable called Clients as its DataSource, the DataSource is fill from an API call,  everything works great.  

On my page I have a button to add a new record, but I dont use the Built-in CRUD operation, instead the button navigates to another page where the user enters the data and click save.

After the data is saved I use the navigation manager to return to the page where the grid is,  using code navigationManager.NavigateTo("clients"); and in that page on the OnInitializedAsync() I call the api to load the Clients IEnumerable.  

The problem is the grid does not refresh, and do not show the new record, I have to move away on the navigation menu and return to clients page in order to see the new record on the grid.

Thank you

9 Replies 1 reply marked as answer
JP Jeevakanth Palaniappan Syncfusion Team February 18, 2021 09:37 AM UTC

Hi Luis, 

Greetings from Syncfusion support. 

We have validated your query and we suggest you to try invoking the Refresh method of the grid after saving the data. Please refer the below API reference of Refresh method and documentation on accessing public methods. 


Please get back to us if you have any other queries. 

Regards, 
Jeevakanth SP. 


LR Luis Roberto February 18, 2021 12:44 PM UTC

Thank you very much Jeevakanth for your help.  I see the documentation you refer but I have another question, 

How Can I refresh the grid if the data is saved in a different page.

I thought about doing it on the OnInitializedAsync(), but that would refresh the grid every time the page Clients load.

Thank you

JP Jeevakanth Palaniappan Syncfusion Team February 19, 2021 12:46 PM UTC

Hi Luis, 

We are quite unclear about the exact way of your implementation. So to proceed further, kindly share us the simple issue reproducing sample which will be helpful for us to validate the issue you are facing and to provide you with a better solution as early as possible. 

Regards, 
Jeevakanth SP. 


LR Luis Roberto February 19, 2021 07:24 PM UTC

Hi Jeevakanth thank you for you reply.  In my project I'm using MVVM pattern, so to test the grid in order to find the error, I made a clean page using the grid without view model, and the grid works fine, it loads all records when the page is initialized after I add a new record on a different page without any problems.

The problem becomes when I connect the grid to a datasource on a viewmodel, let me put my code here and if yout think you can help me I  would really appreciate it.

Clients razor page
@inject ClientsViewModel VM

<SfGrid DataSource="@VM.ClientsList" ID="ClientsGrid" AllowTextWrap="true">
        <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true">
        </GridEditSettings>
        <GridColumns>
            <GridColumn Field=@nameof(Client.ClientId) HeaderText="Cliente Id" TextAlign="TextAlign.Center" Width="10"></GridColumn>           
          <GridColumn Field=@nameof(Client.Name) HeaderText="Name" TextAlign="TextAlign.Left" Width="45"></GridColumn>
        </GridColumns>
</SfGrid>

@code {
    protected override async Task OnInitializedAsync()
    {
        await VM.InitializeViewModelAsync();
    }
}

And this is ViewModel Code

public class ClientsViewModel
    {
        private IClientRepository ApiClientManager { get; set; }
        public List<Client> ClientsList { get; set; }

        public ClientsViewModel(IClientRepository ClientRepository)
        {
            ApiClientManager = ClientRepository;
        }

        public async Task InitializeViewModelAsync()
        {
            ClientsList = await ApiClientManager.GetAllClientes(); // Connects to the Api that brings the data
        }
    }

And in the page that adds the new record after the data is saved on database I navigate to clients page like this

navigationManager.NavigateTo("clients");

When I debug the program, on Clients page after new record is added,  the ClientsList  has all records, so I dont understand why the grid doesnt show all of them but as I mentiond before if I dont use the ViewModel the grid works perfect.

Thanks

JP Jeevakanth Palaniappan Syncfusion Team February 24, 2021 05:46 PM UTC

Hi Luis, 

To validate the reported problem, we are currently preparing a sample based on your scenario. So we will update the further details in two business days. Until then we appreciate your patience. 

Regards, 
Jeevakanth SP. 


LR Luis Roberto February 25, 2021 08:22 PM UTC

Thank you very much Jeevakanth, I really appretiate it.

Take care

JP Jeevakanth Palaniappan Syncfusion Team March 1, 2021 11:26 AM UTC

Hi Luis, 

Thanks for your patience. 

We have created a sample based on your scenario and then added a new record to the database in a separate page and navigated to the grid page to show the data. Now we are able to see that the grid is rendered with the added data. Please refer the below sample for your reference. 


Note: Kindly change the connection string in OrderContext.cs in Data folder to run the application. 

If you are still facing the reported problem then kindly share us the below details, 

  1. Share us the Syncfusion NuGet version details.
  2. Kindly share us the issue reproducing sample or reproduce the issue in the above provided sample.

The above requested details will be helpful for us to validate the issue and provide you with a better solution as early as possible. 

Regards, 
Jeevakanth SP. 


Marked as answer
LR Luis Roberto March 3, 2021 03:47 PM UTC

Hi Jeevakanth, I tried the sample project and it works great. I am going to implement it in my project.

Thank very much for all your help.

Take care

JP Jeevakanth Palaniappan Syncfusion Team March 4, 2021 05:35 AM UTC

Hi Luis, 

Thanks for the update. Please get back to us if you have any other queries. 

Regards, 
Jeevakanth SP. 


Loader.
Up arrow icon