@using Syncfusion.Blazor.Grids
@using Syncfusion.Blazor.Buttons
<SfButton Content="Add Columns" OnClick="AddCol"></SfButton>
@if (ShowGrid)
{
<SfGrid @ref="Grid" Columns="Cols" DataSource="@OrderData">
</SfGrid>
}
@code{
public bool ShowGrid { get; set; } = true;
SfGrid<Order> Grid { get; set; }
public List<GridColumn> Cols = new List<GridColumn> {
new GridColumn(){ Field = "OrderID", Width = "100" },
new GridColumn(){ Field = "CustomerID", Width = "100" },
new GridColumn(){ Field = "EmployeeID", Width = "100" },
};
public async Task AddCol()
{
List<GridColumn> cols = await Grid.GetColumns(); // to get the exisitng columns
ShowGrid = false; // remove the Grid
StateHasChanged();
Cols = new List<GridColumn>();
foreach (var col in cols) // generate the existing column
{
Cols.Add(new GridColumn() { Field = col.Field, Width = "100" });
}
Cols.Add(new GridColumn() { Field = "Freight", Width = "100", Format = "C2" }); // add new column here
ShowGrid = true; // re-render the Grid
StateHasChanged();
}
} |