Get filter options from grid lookup datasource instead of fetching them from server

Question

I have a devextreme datagrid with remote operations configured with lookup columns. When I click the filter row of that column, options are populated from a server call instead of displaying the values in the lookup datasource (an object array). I don't want this expensive database grouping query generated by that call, I already have the values in my view. I want the exact opposite requested in this question How can I achieve my desired behavior?

My dxdatagrid options:

<script src="https://cdn3.devexpress.com/jslib/23.1.3/js/dx.all.js"></script>

{
                dataSource: DevExpress.data.AspNet.createStore({
                    key: 'id',
                    loadUrl: '/grid/data',
                    onBeforeSend(method, ajaxOptions) {
                        ajaxOptions.xhrFields = { withCredentials: true };
                    },
                }),
                remoteOperations: true,
                onEditorPreparing: function (e) {
                    if (e.parentType === "filterRow" && e.dataField === "channelId") {
                        e.editorOptions.onValueChanged = function (arg) {
                            filterEditor.option("dataSource", {
                                store: _statuses,
                                filter: ["channelId", "=", arg.value]
                            });
                            e.setValue(arg.value);
                        };
                    }
                },
                onEditorPrepared: function (e) {
                    if (e.parentType === "filterRow") {
                        if (e.dataField === "status") {
                            filterEditor = e.editorElement.dxSelectBox("instance");
                        }
                    }
                },
                columns: [{
                    type: "buttons",
                    width: 30,
                    buttons: [{
                        hint: 'Ver',
                        icon: 'eyeopen',
                        onClick(e) {
                            openModal(e.row);
                            e.event.preventDefault();
                        },
                    }]
                }, {
                    dataField: 'id',
                    caption: 'Codigo',
                }, {
                    dataField: 'created',
                    caption: 'Creada en',
                    dataType: 'date',
                    format: 'shortDateShortTime'
                }, {
                    dataField: 'channelId',
                    caption: 'Canal',
                    dataType: 'number',
                    setCellValue(rowData, value) {
                        rowData.channelId = value;
                        rowData.status = null;
                    },
                    lookup: {
                        dataSource: {
                            store: _channels
                        },
                        valueExpr: 'value',
                        displayExpr: 'text',
                    },
                }, {
                    dataField: 'status',
                    caption: 'Estado',
                    lookup: {
                        dataSource: function (options) {
                            return {
                                store: _statuses,
                                filter: options.data ? ['channelId', '=', options.data.channelId] : null
                            };
                        },
                        valueExpr: 'status',
                        displayExpr: 'description'
                    },
                    calculateDisplayValue: function (rowData) {
                        let found = _statuses.filter(s => s.channelId == rowData.channelId && s.status == rowData.status);
                        return found[0].description;
                    }
                }, {
                    dataField: 'statusGroup',
                    caption: 'Grupo',
                    lookup: {
                        dataSource: _statusGroups,
                        valueExpr: 'value',
                        displayExpr: 'text',
                    }
                }, {
                    dataField: 'contact_Name',
                    caption: 'Nombre',
                }
                ],
                filterRow: {
                    visible: true,
                },
                headerFilter: {
                    visible: false,
                },
                groupPanel: {
                    visible: true,
                },
                scrolling: {
                    mode: 'virtual',
                    rowRenderingMode: 'virtual',
                },
                paging: {
                    pageSize: 10,
                },
                pager: {
                    visible: true,
                    allowedPageSizes: [5, 10, 25],
                    showPageSizeSelector: true,
                    showInfo: true,
                    showNavigationButtons: true,
                }
            }

Answer 1

Finally found it. The key is to set the option 'syncLookupFilterValues' to false.

syncLookupFilterValues