WebApiAdaptor to use OData v4

[Bas]

Hello,

Hope you are well. I'm using the WebApiAdaptor in my grid which for initial loading, paging and sorting works great, except for the filtering. This because it is using the OData v3 filtering like for instance 'substring' in stead of OData v4 version of 'contains'. My api only excepts the OData v4 filtering, so my question is can the WebApiAdaptor use those filters? If so how could I make it so that it will use the OData v4 filters? If it can't than how can I make it work? I tried with the ODataV4Adaptor, but that doesn't work as my api excepts OData filters but doesn't return them. So with the ODataV4Adaptor it doesn't work either. Any help would be greatly appreciated. Thank you in advance.

Kind regards,

Bas Kursten

[Vignesh Natarajan]

Hi Bas,  

 

Thanks for contacting Syncfusion support.  

 

Query: “If so how could I make it so that it will use the OData v4 filters? If it can't than how can I make it work?” 

 

We have analyzed your query and we understand that you want to send the filter query (similar to ODataV4 filter request) to your WebAPI controller. We have achieved your requirement by writing a new adaptor extending the WebAPIAdaptor and overridden the onpredicate method to change the filter request.  

 

Refer the below code example.  

 

<SfGrid TValue="Orders" @ref="@grid" AllowPaging="true" AllowSorting="true" AllowFiltering="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete" })" Query="@GridQuery">    <SfDataManager @ref="DM" Url="api/Default" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager>. . . . </SfGrid> @code{     public static SfDataManager DM { get; set; }     SfGrid<Orders> grid { get; set; }    public Query GridQuery = new Query();    public static int? val = null;     public class CustomODataV4 : WebApiAdaptor    {                public CustomODataV4(DataManager dataManager) : base(dataManager)        {         }        public override string OnPredicate(WhereFilter filter, DataManagerRequest query, bool requiresCast = false)        {            return new ODataV4Adaptor(DM).OnPredicate(filter, query, requiresCast);        }    }     protected override void OnAfterRender(bool firstRender)    {        base.OnAfterRender(firstRender);        if (DM != null)        {#pragma warning disable BL0005            DM.DataAdaptor = new CustomODataV4(DM);#pragma warning restore BL0005        }    }

 

    

Kindly refer the below sample for your reference 

 

Sample: https://www.syncfusion.com/downloads/support/forum/167127/ze/DataGrid-339839243.zip  

 

Note: Filter will not work in provided sample. but we can ensure the modified querystring sent to server for filter query.  

 

Please get back to us if you have further queries.  

 

Regards, 

Vignesh Natarajan 

[Bas]

Hi Vignesh,

Thank you for your response. Never thought about solving it that way thank you. This should work great.

Kind regards,

Bas Kursten

[Vignesh Natarajan]

Hi Bas,  

Thanks for the update.  

We are glad to hear that you have achieved your requirement using our solution.  

Kindly get back to us if you have further queries.  

Regards, 

Vignesh Natarajan 

[Joshua Goughnour]

Hello,

I have implemented this solution and it works well everywhere except for the individual column filter window. When typing in the filter text the dropdown that populates with found options still sends a 'substring' filter to the API. 

Is there also a way to override this filter dropdown functionality with the ODataV4 version? Or is there a way to disable the

Thank you, 

Josh Goughnour

[Rahul Narayanasamy]

Hi Joshua, 

Greetings from Syncfusion. 

We are currently checking the reported query at our end and we will update the further details within two business days. Until then we appreciate your patience. 

Regards, 

Rahul 

[Rahul Narayanasamy]

Hi Joshua, 

Thanks for your patience. 

We have checked your query and we are able to reproduce the reported behavior while typing the values in menu filter autocomplete.  You can overcome the reported behavior by using below solution. You want to send this request like the previously modified one. You can achieve your requirement by using FilterTemplate and OnActionComplete event.  

Here, we have rendered SfAutoComplete in FilterTemplate and we have assigned the extended new adator to the auto complete control in OnActionComplete event. Find the below code snippets and sample for your reference. 

 

<SfGrid TValue="Orders" @ref="@grid" AllowPaging="true" AllowSorting="true" AllowFiltering="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete" })" Query="@GridQuery"> 

    <SfDataManager @ref="DM" Url="api/Default" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager> 

    <GridFilterSettings Type="Syncfusion.Blazor.Grids.FilterType.Menu"></GridFilterSettings> 

    <GridEvents OnActionComplete="ActionCompletedHandler" TValue="Orders"></GridEvents> 

    <GridColumns> 

        <GridColumn Field=@nameof(Orders.OrderID) HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn> 

        <GridColumn Field=@nameof(Orders.CustomerID) HeaderText="Customer Name" FilterSettings="@(new FilterSettings{ Operator = Operator.Contains })" Width="150"> 

            <FilterTemplate> 

                <SfAutoComplete TValue="string" TItem="Orders" Placeholder="Select a name" Autofill="true"> 

                    <SfDataManager @ref="AutoDM" Url="api/Default" CrossDomain="true" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager> 

                    <AutoCompleteFieldSettings Value="CustomerID"></AutoCompleteFieldSettings> 

                </SfAutoComplete> 

            </FilterTemplate> 

        </GridColumn> 

        <GridColumn Field=@nameof(Orders.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn> 

        <GridColumn Field=@nameof(Orders.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn> 

    </GridColumns> 

</SfGrid> 

 

@code{ 

 

    public static SfDataManager DM { get; set; } 

    public static SfDataManager AutoDM { get; set; } 

 

    SfGrid<Orders> grid { get; set; } 

    public Query GridQuery = new Query(); 

    . . . 

 

    public class CustomODataV4AC : WebApiAdaptor 

    { 

        public CustomODataV4AC(DataManager dataManager) : base(dataManager) 

        { 

 

        } 

        public override string OnPredicate(WhereFilter filter, DataManagerRequest query, bool requiresCast = false) 

        { 

            return new ODataV4Adaptor(AutoDM).OnPredicate(filter, query, requiresCast); 

        } 

    } 

    public void ActionCompletedHandler(ActionEventArgs<Orders> args) 

    { 

        if (args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.FilterAfterOpen)) 

        { 

            if (AutoDM != null) 

            { 

#pragma warning disable BL0005 

                AutoDM.DataAdaptor = new CustomODataV4AC(AutoDM); 

#pragma warning restore BL0005 

            } 

        } 

    } 

 

    . . . 

} 

Sample: https://www.syncfusion.com/downloads/support/forum/167127/ze/WebAPISample844312407  

Please let us know if you have any concerns. 

Regards, 

Rahul 

[IAN MORLEY]

Hello Syncfusion -- I have the same problem as described above. Has a better solution been released yet? I'm running version 31.1.21. 

Adding FilterTemplate for every column is very tedious. 

Alternatively, can I use a CustomAdapter that extends from WebApiAdapter and addresses this problem acros

[Vignesh Natarajan]

Hi Ian,

Thank you for your update, and apologies for the delay in getting back to you.

We’ve carefully reviewed your requirement for an alternative approach, and we’d like to inform you that the requested functionality is quite unique and, unfortunately, not feasible to implement within our current architecture.

In our Menu Filtering implementation, we use different components in the filter dialog based on the data type of the column. For string-type columns, the AutoComplete component is rendered by default to enhance the filtering experience. Since AutoComplete is a data-bound component, it requires a predefined list of values to function correctly. The solution we previously suggested involves defining the WebAPI adaptor in the SfDataManager component. Once the Grid is rendered, we dynamically change its DataAdaptor using the OnAfterRender lifecycle method. So that WebAPI adaptor generates the filter query in form of ODataV4 service.

But still the default WebAPI adaptor is assigned to the AutoComplete component inside the filter dialog, allowing it to fetch data during filtering. However, unlike the parent Grid component, it is not possible to dynamically change the DataAdaptor for the AutoComplete component in the same way.

We want to reassure you that the solution we’ve already provided is the only viable approach to meet your requirement. Please let us know if you have any further questions or if there's anything else we can assist you with.

Best regards,
Vignesh Natarajan