ODataV4 DM does not auto expand and auto select in Grid

[Brice FROMENTIN]

,

Here is my grid

<EjsGrid TValue="ExpandoObject" AllowResizing="true" AllowPaging="true" AllowSorting="true" AllowFiltering="true" Width="100%" Height="100%">
    <GridPageSettings PageSize="50" />
    <EjsDataManager Adaptor="Adaptors.ODataV4Adaptor" Url=@(RestClient.RootUrl + "odata/utilisateurs") />
    <GridColumns>
        <GridColumn Field="Id" HeaderText="ID" IsPrimaryKey=true Visible="false"></GridColumn>
        <GridColumn Field="Nom" HeaderText="Nom" Width="auto"></GridColumn>
        <GridColumn Field="Nom" HeaderText="Prénom" Width="auto"></GridColumn>
        <GridColumn Field="Service.Nom" HeaderText="Service" Width="auto"></GridColumn>
        <GridColumn Field="Date" HeaderText="CreationDate" Format="yMd" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>
        <GridColumn Field="Mel" HeaderText="Mel" TextAlign="TextAlign.Right" Width="120"></GridColumn>
    </GridColumns>
</EjsGrid>

If I use this, here is he ODataV4 query :

http://localhost:7121/api/odata/utilisateurs?$count=true&$skip=0&$top=50

You see that there is no select and expand for the "Service" navigation property.

And the answer

{"@odata.context":"http://localhost:7121/api/odata/$metadata#Utilisateurs","@odata.count":1,"value":[{"Id":"f63a02c7-4a37-491f-a13b-4d680429f1c7","DateCreation":"2020-02-19T07:16:04.44+01:00","UtilisateurCreation":null,"Modification":null,"UtilisateurModification":null,"Login":"admin","MotDePasse":"XXX","Prenom":"Brice","DeuxiemePrenom":null,"Nom":"FROMENTIN","Mel":"XXX","Telephone":null,"Fax":null,"IdService":"f4c8499f-da3b-430e-ad39-d5aaab8beae3"}]}

Is there a way to automagically :) have select and expand be used ?

Thx

Brice.

[Vignesh Natarajan]

Hi Brice,  

Thanks for contacting Syncfusion forums.  

Query: “Is there a way to automagically :) have select and expand be used ?” 

 

We suggest you to achieve your requirement (send select & expand query automatically) using Query property of EjsGrid. Refer the below code example.  

 <EjsGrid TValue="ExpandoObject" AllowResizing="true" Query="@QueryData" AllowPaging="true" AllowSorting="true" AllowFiltering="true" Width="100%" Height="100%"> 

. . . .. . .  

    </EjsGrid> 

@code{ 

    public Query QueryData = new Query().Select(new List<string>() {"Service"}).Expand(new List<string>() { "Service" }); 

} 

Refer our UG documentation for your reference 

https://ej2.syncfusion.com/blazor/documentation/grid/data-binding/#sending-additional-parameters-to-the-server  

If above solution does not resolve your query, kindly get back to us with more details.   

Regards, 

Vignesh Natarajan. 

[Brice FROMENTIN]

Thx a lot, it works perfectly for the select and the expand.

However, I still have an issue with the binding of this column :

<GridColumn Field="Service.Nom" HeaderText="Service" Width="auto"></GridColumn>

Even if it is OK in the server response, nothing is displayed :(

Do you think that the automatic select&display should become an option to enhance the performance and network consumption ?

Brice.

[Vignesh Natarajan]

Hi Brice,  

 

Thanks for the update. 

 

Query: “Even if it is OK in the server response, nothing is displayed” 

 

We have prepared a sample a sample as per your suggestion using our latest 17.4.0.50 version Nuget and we are not able to reproduce the reported issue at our end. Kindly refer the below link for the sample.  

 

Sample: https://www.syncfusion.com/downloads/support/forum/151757/ze/odatasample-1220881640  

 

Note: above project consist of two solution. First run ODataV4Serivice sample and then run BlazorApp1 sample.  

 

After referring the sample, if you are still facing the issue kindly get back to us with following details.  

 

1. Share your grid code example.
2. Share the dataSource returned from server.
3. Share your Nuget package version.
4. Kindly bind the OnActionComplete event to grid and share the exception thrown from the event arguments.
5. If possible try to reproduce the reported issue in provided sample.

 

Regards, 

Vignesh Natarajan.  

[Brice FROMENTIN]

Hello,

I reproduce my issue by just setting "TValue" to "ExpandoObject", here is the modyfied page :

@page "/"

@using System.ComponentModel.DataAnnotations;

@using System.Dynamic;

@using Syncfusion.EJ2.Blazor

@using Syncfusion.EJ2.Blazor.Data

@using Syncfusion.EJ2.Blazor.Grids

<EjsGrid TValue="ExpandoObject" AllowPaging="true" AllowSelection="true" AllowFiltering="true" Toolbar="@(new List<string>() { "Search"})" Query="@QueryData">

    <EjsDataManager Url="http://localhost:64956/odata/books" Adaptor="Adaptors.ODataV4Adaptor"></EjsDataManager>

    <GridColumns>

        <GridColumn Field="Guid" HeaderText="Order ID" IsPrimaryKey="true" TextAlign="@TextAlign.Right" Width="90"></GridColumn>

        <GridColumn Field="Title" HeaderText="Customer Name" Width="90"></GridColumn>

        <GridColumn Field="Author" HeaderText="Employee ID" Width="90"></GridColumn>

        <GridColumn Field="Site.SiteName" HeaderText="Sitio" TextAlign="TextAlign.Left" Width="40">            

        </GridColumn>

    </GridColumns>

</EjsGrid>

@code{

    public Query QueryData = new Query().Expand(new List<string> { "Site" });    

    public class Site

    {

        public Guid Id { get; set; }

        public string SiteName { get; set; }

        public List<Book> Books { get; set; } = new List<Book>();

    }

    public class Book

    {

        [Key]

        public Guid Guid { get; set; }

        public Guid? SiteId { get; set; }

        public Site Site { get; set; }

        public int Id { get; set; }

        public string ISBN { get; set; }

        public string Title { get; set; }

        public string Author { get; set; }

        public decimal Price { get; set; }

    }   

}

Brice.

[Vignesh Natarajan]

Hi Brice,  

Thanks for the update.  

Query: “I reproduce my issue by just setting "TValue" to "ExpandoObject", here is the modyfied page ” 

Now we are able to reproduce the reported issue at our end. We can achieve your requirement using Column Template feature of EjsGrid. Because we use reflection property to bind complex object in grid. But ExpandoObject does not support reflection. Hence we suggest you to achieve your requirement using Column Template.  

<EjsGrid TValue="ExpandoObject" AllowPaging="true" AllowSelection="true" AllowFiltering="true" Toolbar="@(new List<string>() { "Search"})" Query="@QueryData">

    <EjsDataManager Url="http://localhost:64956/odata/books" Adaptor="Adaptors.ODataV4Adaptor"></EjsDataManager> 

    <GridColumns> 

        <GridColumn Field="Guid" HeaderText="Order ID" IsPrimaryKey="true" TextAlign="@TextAlign.Right" Width="90"></GridColumn> 

        <GridColumn Field="Title" HeaderText="Customer Name" Width="90"></GridColumn> 

        <GridColumn Field="Author" HeaderText="Employee ID" Width="90"></GridColumn> 

        <GridColumn Field="Site.SiteName" HeaderText="Sitio" TextAlign="TextAlign.Left" Width="40"> 

            <Template> 

                @{  

                    dynamic text = (context as ExpandoObject);                   

                    <span>@text.Site.SiteName</span> 

                } 

            </Template> 

        </GridColumn> 

    </GridColumns> 

</EjsGrid> 

Refer our Ug documentation for your reference 

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

Kindly get back to us if you have any queries.  

Regards, 

Vignesh Natarajan. 

[Brice FROMENTIN]

Thx for the template it works correctly.

But I feel we can make a better code using ValueAccessor but I did not find any Blazor Sample. Could you guide me where to find information or explain me how it works ?

Thx for your great support.

[Vignesh Natarajan]

Hi Brice,  

 

Thanks for the update. 

 

Query: But I feel we can make a better code using ValueAccessor but I did not find any Blazor Sample.” 

 

We have validated your query and we have considered your requirement as a usability feature “ValueAccessor Support in Blazor Grid”. We are always trying to make our products better and feature requests like yours are a key part of our product growth efforts. At the planning stage for every release cycle, we review all open features and identify features for implementation based on specific parameters including product vision, technological feasibility, and customer interest. Fix for the usability feature will be included in any of our upcoming releases. 

 

You can also communicate with us regarding the open features any time using our Feature Report page. 

 

https://www.syncfusion.com/feedback/12351/valueaccessor-support-in-blazor-grid  

 

Till then we suggest you to achieve your requirement using Column Template (suggested in previous update) feature.  

 

Regards, 

Vignesh Natarajan. 

[Jayabharathi J]

Thanks for the good news. As the grid support only flat « ExpandoObject », I send you one possible implementation to go one step further. I made it for the future value accessor 

 

I hope it will help you to implement complex binding width ExpandoObject 😊 

 

Brice. 

ColumnHelpersTests
 

ColumnHelpers

[Vignesh Natarajan]

Hi Brice,  

Thanks for your suggestion.  

Once ValueAccessor support is provided, you can achieve your requirement using this method.  

Kindly get back to us if you have any other queries.   

Regards, 

Vignesh Natarajan.