Bind GridColumn field to indexed element

[John]

Hi, 

With the Blazor EjsGrid control is it possible to bind a GridColumn to an indexed value like you can with the WPF version?

e.g. 

<GridColumn Field="Values[0]" HeaderText="Values[0]" />

Thanks, John

[Vignesh Natarajan]

Hi John, 

Greetings from Syncfusion support.  

Query: “With the Blazor EjsGrid control is it possible to bind a GridColumn to an indexed value” 

Yes. We can render the GridColumns by dynamically building them based on the list of strings. We have already documented this topic in our UG documentation which can be referred below  

UG: https://ej2.syncfusion.com/blazor/documentation/grid/columns/#dynamic-column-building  

Please get back to us if you have further queries.  

Regards, 

Vignesh Natarajan.

[John]

Thank you for the response, but it does not explain how/whether it is possible to bind to indexed values (https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/indexers/).  I know you support this in the WPF version  (https://help.syncfusion.com/wpf/datagrid/data-binding#binding-indexer-properties)

Thanks, John

[Vignesh Natarajan]

Hi John,  

 

Query: “but it does not explain how/whether it is possible to bind to indexed values” 

  

We have prepared a sample as per your requirement (to render Grid columns based on index value of an array). Kindly refer the below code example.  

  

<EjsGrid DataSource"@OrderData"> 

    <GridColumns> 

        @for (var I = 0; I < Cols.Length; I++) 

        { 

            <GridColumn Field="@Cols[I]" IsPrimaryKey="@(Cols[I] == "OrderID")" HeaderText="@Header[I]"></GridColumn> 

        } 

    </GridColumns> 

</EjsGrid> 

 

@code{ 

    public string[] Cols = { "OrderID", "CustomerID", "EmployeeID" }; 

    public string[] Header = { "ID", "Name", "Batch ID" }; 

 

Refer the below screenshot for the output 

 

 

   

Also download the sample from below  

 

Sample: https://www.syncfusion.com/downloads/support/forum/147723/ze/BlazorApp11874012464  

 

Kindly confirm whether above solution satisfy your requirement. If not share more details about your requirment along with the index value properties.   

 

Regards, 

Vignesh Natarajan. 

[John]

Thank you for the response, but it is not the headers or fixed fields I am worried about, but binding to indexed values.  I have included an example below, but please also see the link to the same functionality in your WPF version at (https://help.syncfusion.com/wpf/datagrid/data-binding#binding-indexer-properties).  Thank you

@page "/"

@using Syncfusion.EJ2.Blazor.Grids

   

       

   

@code {

    private List rows = new List() { new Row() };

    private class RowValues : IList

    {

        public double this[int index]

        {

            get

            {

                return ...;

            }

        }

...

    }

    private class Row

    {

        public RowValues RowValues { get; } = new RowValues();

        

    }

}

[Vignesh Natarajan]

Hi John,  

Sorry for the inconvenience caused.  

Query: “but it is not the headers or fixed fields I am worried about, but binding to indexed values.” 

 

We do not have support to bind the indexer property values to EjsGrid. But you can achieve your requirement (to display data based on Indexer values) using Column Template feature of EjsGrid.  However we will not be able to perform Data Operations like filtering, sorting, CRUD etc in Grid.  

Refer the below code example  

<EjsGrid ModelType="@RowValue[0]" DataSource="@RowValue"> 

    <GridColumns> 

        <GridColumn Field=@nameof(RowValues.ID)></GridColumn> 

        <GridColumn HeaderText="Names"> 

            <Template> 

                @{ 

                    var index = (context as RowValues)[0]; 

                    <span>@index</span> 

                } 

            </Template> 

        </GridColumn> 

    </GridColumns> 

</EjsGrid> 

@code{ 

    public class RowValues 

    { 

        private List<string> rows = new List<string>() { "VINET" }; 

        public string this[int index] 

        { 

            get 

            { 

                return rows[index]; 

            } 

        } 

        public int ID { get; set; } 

    } 

    public List<RowValues> RowValue = new List<RowValues>() 

    { 

     new RowValues(){ ID = 1 } 

    }; 

} 

For your reference we have prepared a sample which can be downloaded from below link  

Sample: https://www.syncfusion.com/downloads/support/forum/147723/ze/BlazorApp1915698430  

Refer our UG documentation for your reference 

https://ej2.syncfusion.com/blazor/documentation/grid/columns/#column-template  

Please get back to us if you have further queries.   

Regards, 

Vignesh Natarajan. 

[John]

Thank you for the response, but we need the ability to sort, filter & group.

1.  Is this something you are likely to support soon?

2. In the absence of this, is there any other way to bind the grid to elements that are not known at compile time?  e.g. DataTable, dynamic object, implementing some interface etc..

In 50% of our uses of grid, we do not have a fixed class to bind to at compile time.  I can't image this is an unusual request, and you support various mechanisms in your WPF version.

Regards, John

[Vignesh Natarajan]

Hi John,  

 

Query: “In the absence of this, is there any other way to bind the grid to elements that are not known at compile time?” 

As mentioned in the previous update, we are not able to perform data operation while binding the data using indexer property or using ExpandoObject / anonymous object. But we would like to inform you that, we have considered this (data operations using ExpandoObject / dynamic object) requirement as feature and it will be included in any of our upcoming release.  

You can track the status of these features using the below feedback links, 

 

Feedback: https://www.syncfusion.com/feedback/6896/need-to-provide-editing-support-for-expandoobject-type-binding  

 

Feedback: https://www.syncfusion.com/feedback/6878/need-crud-operation-support-for-anonymous-type-binding 

Till then we appreciate your patience.  

Regards, 

Vignesh Natarajan. 

 

[Peter Drier]

3+ years later, is it yet possible to properly access the index operator?  

Specifically from John's September 26, 2019 message above? Cheers, Peter

[Monisha Saravanan]

Hi Peter,

We would like to inform that we don’t have support for indexer property in Blazor DataGrid. Please let us know if you have any concerns.