How to assign datasource to column grid programmatically

[Dodi]

I would like to ask how to create column and assign datasource to column grid programmatically

As there is no datasource property in grid column, I assume it might using ColumnData ? or is there any method ?

For example I would like the Customers data source to a grid column and set both the ForeignKeyField and ForeignKeyValue to ID and Text.

List col = new List();
col.Add(new GridColumn() { Field = "OrderID", HeaderText = "ID" });
col.Add(new GridColumn() { Field = "CustomerID", HeaderText = "Name", EditType = EditType.DropDownEdit, ColumnData=Customers, ForeignKeyField="ID", ForeignKeyValue = "Text" });

The above code did not gave error during build process but it show an error when running.

Could you please give examples on how to set the grid column datasource programmatically ?

Thank you.

Here is the complete code :

@page "/"
@using Syncfusion.Blazor.Grids
<h2>DataGrid</h2>
<br/>
<div id = "ControlRegion">
<SfGrid  ID="Grid" DataSource="@Orders"  @ref="Grid" AllowPaging="true" AllowFiltering="true" AllowReordering="true" AllowResizing="true" AllowGrouping="true" AllowExcelExport="true" AllowSelection="true"
              AllowSorting="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update","ExcelExport","Search"})" Height="315" Width="900" Columns="@col">
        <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Normal"></GridEditSettings>
        <GridFilterSettings Type="Syncfusion.Blazor.Grids.FilterType.FilterBar"></GridFilterSettings>
    <GridPageSettings PageSizes="true"></GridPageSettings>
<GridSelectionSettings Type="Syncfusion.Blazor.Grids.SelectionType.Multiple"></GridSelectionSettings>
        <GridEvents OnToolbarClick="ToolbarClick" TValue="Order"></GridEvents>
    </SfGrid>
</div>
<br/>

@code{
publicListOrders{get;set;}
SfGridGrid;
List col =newList();

protected override void OnInitialized()
{
Orders=Enumerable.Range(1,75).Select(x =>newOrder()
{
OrderID=1000+ x,
CustomerID=(newstring[]{"ALFKI","ANANTR","ANTON","BLONP","BOLID"})[newRandom().Next(5)],
Freight=2.1* x,
OrderDate=DateTime.Now.AddDays(-x),
ShipCountry=(newstring[]{"USA","UK","CHINA","RUSSIA","INDIA"})[newRandom().Next(5)]
}).ToList();

col.Add(newGridColumn(){Field="OrderID",HeaderText="ID"});
col.Add(newGridColumn(){Field="CustomerID",HeaderText="Name",EditType=EditType.DropDownEdit,ColumnData=Customers,ForeignKeyField="ID",ForeignKeyValue="Text"});

}
​
public void ToolbarClick(Syncfusion.Blazor.Navigations.ClickEventArgs args)
{
if(args.Item.Id=="Grid_excelexport")
{
this.Grid.ExcelExport();
}
}
​
public class Order
{
public int? OrderID{get;set;}
public string CustomerID{get;set;}
public DateTime? OrderDate{get;set;}
public double? Freight{get;set;}
public string ShipCountry{get;set;}
}
​
public class Customer
{
public string ID {get;set;}
public string Text{get;set;}
}

private List Customers = new List() {
        new Customer(){ ID= "ALFKI", Text= "Customer 1" },
        new Customer(){ ID= "ANANTR", Text= "Customer 2" },
        new Customer(){ ID= "ANTON", Text= "Customer 3" },
        new Customer(){ ID= "BLONP", Text= "Customer 4" },
        new Customer(){ ID= "BOLID", Text= "Customer 5" }
     };
}

[Dodi]

Updated source code

[Vignesh Natarajan]

Hi Dodi,

Greetings from Syncfusion support.

Query: “Could you please give examples on how to set the grid column datasource programmatically ?”

We understand that you want to define the Column datasource dynamically. We would like to inform you that the Column datasource property can be defined only to the column with ForeignKey relation between the Grid datasource and Column datasource. We can build the column dynamically using the below UG documentation. Kindly refer to the below link for your reference

https://blazor.syncfusion.com/documentation/datagrid/columns#dynamic-column-building

But the DataSource property can be defined only by the column with ForeignKey behavior. So kindly share more details about your requirements, which will be very helpful for us to validate the reported query at our end and provide a solution as early as possible.

Regards,

Vignesh Natarajan