SFGrid in Blazor

SFGrid is a grid component provided by synfcusion that we use in blazor to create grid's that have some amazing features like incremental search, agreggate sum, pagination and many more column formatting.

The issue occurs when you pass any datasource to SFGrid and than try to pass different datasource to that. You will notice it doesn't refresh the schema of grid as per the passed datasource. In that case we have to do this

@if (RenderGridData) 
{ 
    <SfGrid 
    @ref="gridObj" 
    Height="400px" 
    Width="100%" 
    TValue="ExpandoObject" 
    DataSource=@data> 
    </SfGrid> 
} 
 
    public bool RenderGridData= true; 
    public async Task OnGenerateNewData() 
    { 
        RenderGridData= false; 
        await Task.Yield(); 
        this.data = RandomDataSource(); 
        RenderGridData= true; /*Set True after changing the datasource*/
       
    } 
 

As you can see , we have to keep the component inside a bool variable and than we have to set the value to false before changing the datasource and than put it back to true after the datasource is changed. Now , run the application and you will see your grid component will refresh as per the passed datasource.

So, this is how you can solve the issue Changing sfgrid datasource does not work in Blazor.