Hey team!
Assuming a simple grid with a nested / complex data binding (somethingExpanded.detail in this excerpt):
<template>
<div id="app">
<ejs-grid :dataSource='data' :query='query' :allowFiltering='true' :filterSettings='filterSettings'>
<e-columns>
<e-column field='id' headerText='An ID' textAlign='Right' width=100></e-column>
<e-column field='somethingExpanded.detail' headerText='Expanded detail' width=120></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
Using the query expand to join a column, and a Menu type filter:
<script>
import Vue from "vue";
import { GridPlugin, Filter } from "@syncfusion/ej2-vue-grids";
Vue.use(GridPlugin);
export default {
data() {
return {
data: anODataV4Source,
query: new Query().expand(['somethingExpanded'])
filterSettings: {
type: 'Menu',
ignoreAccent: true,
columns: [
{
field: 'somethingExpanded.detail',
operator: 'equal',
predicate: 'and',
matchCase: true,
value: 'whatever',
}
],
}
};
},
provide: {
grid: [Filter]
}
}
</script>
The ODataV4 source is working exactly as expected and the somethingExpanded table is appropriately added as $expand: somethingExpanded and accurately left joined by the server.
Yet, the generated filter query is not a valid ODataV4 one as it becomes: $filter: (somethingExpandeddetail eq 'whatever') instead of $filter: (somethingExpanded/detail eq 'whatever') (notice the slash / between somethingExpanded and detail, the nested field).
If I intercept the query server side, and string replace "somethingExpandeddetail" to "somethingExpanded/detail" then the query works exactly as expected.
Here is the question: did I miss something in the frontend grid configuration that leads me there? Or do you think that just looks like a bug in the underlying query building process?
Thanks for your help!
