DataGrid Render using dynamic column binding & data binding

Dhanya Nithin

I have list of columns for grid specified in a table 'Controls' containing the column_name & column_caption and a SRNO with some other extra details which is not necessary here.

public IEnumerable datagrid { get; set; } --> this contains the list of rows from above table.

List> gridData { get; set; } = new List>(); --> this contains data for the grid where dictionary key is set to be column_name from the above ControlSettings class.

@foreach (var column in datagrid)
{

}

This is the code i used for displaying the grid. But the grid is not getting displayed & getting error.

Error is : ArgumentException: Cannot detect the member of System.Collections.Generic.Dictionary`2[System.String,System.Object] (Parameter 'LOC')

Note: LOC is one of the column_name

The issue might be because of dictionary usage.

please help me with any suggestions to make this code work.

3 Replies

Know the answer? Post it — somebody with the same question will find it here.

Amit Mohanty2y ago
The issue you're facing might be due to the way you are trying to bind dynamic data structures like dictionaries to strongly typed components. When you specify TItem="Dictionary", the compiler tries to infer properties from Dictionary, which is not a strongly typed class with predefined properties.

So you need to provide a strongly typed class or structure that Blazorise DataGrid can use to infer the properties.
Dhanya Nithin2y ago
This is what i have already done & giving the same error as i posted before

Jithu Thomas2y ago

// Assuming ControlSettings class has properties for COLUMN_NAME and COLUMN_CAPTION
public class ControlSettings
{
    public string COLUMN_NAME { get; set; }
    public string COLUMN_CAPTION { get; set; }
    // Add other necessary properties if needed
}

// Your component class
@page "/your-page"

@code {
    // Sample data for ControlSettings, replace this with your actual data
    public List datagrid = new List
    {
        new ControlSettings { COLUMN_NAME = "LOC", COLUMN_CAPTION = "Location" },
        // Add more rows as needed
    };

    // Sample data for the grid, replace this with your actual data
    List> gridData = new List>
    {
        new Dictionary
        {
            {"LOC", "Value1"},
            // Add more key-value pairs for other columns
        },
        // Add more rows as needed
    };
}


    
        @foreach (var column in datagrid)
        {
            
        }

try this code snippet.