Kendo UI 网格数据源触发额外的 ajax 过滤器请求

Question

我在我的项目中使用 Kendo UI 网格来构建订单列表，它有一个数据源，可以通过 ajax 请求立即加载所有订单，并且它在本地处理它们（过滤、排序、分页），无需额外请求。

这是我用来设置它的代码：

$("#layby-list").kendoGrid({
    columns: [
        {
            title: "Order date",
            field: 'order_d',
            filterable: {cell: {operator: "eq", showOperators: false}},
            format: "{0:dd/MM/yyyy}"
        },
        {
            title: "Order number",
            field: 'order_n',
            filterable: {cell: {operator: "eq", showOperators: false}},
        },
        {
            title: "Customer",
            field: 'customer',
            filterable: {cell: {operator: "startswith", showOperators: false}}
        }
    ],
    filterable: {
        mode: "row"
    },
    selectable: "row",
    sortable: true,
    resizable: true,
    navigatable: true,
    pageable: {
        pageSize: 10
    },
    groupable: true,
    dataSource: {
        transport: {
            read: {
                url: baseUrl,
                dataType: "json",
                type: "POST",
                data: {
                    action: 'loadOrders'
                }
            }
        },
        schema: {
            data: "data",
            total: "total",
            type: "json",
            model: {
                fields: {
                    order_d: {type: 'date'},
                    order_n: {type: 'number'},
                    customer: {type: 'string'}
                }
            }
        }
    }
});

这非常有效，除非我尝试过滤 "customer" 列，因为该过滤器是自动完成的，它执行的请求与加载网格以显示所有选项时执行的请求完全相同，所以问题是: 是否可以通过在网格及其过滤器之间共享数据来避免该请求？

Answer 1

您可以向 'Customer' 列过滤器提供数据源 (http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columns.filterable.cell.dataSource)：

{
    title: "Customer",
    field: 'customer',
    filterable: {
        cell: {
            operator: "startswith",
            showOperators: false,
            dataSource: new kendo.data.DataSource({
                data: [
                    { customer: "...." },
                    { customer: "...." },
                    { customer: "...." }
                ]
            }),
        }
    }
}

Answer 2

我遇到了同样的问题并解决了更改

filterable: {
    mode: "row"
},

到

filterable: {
    mode: "menu"
},

Kendo UI 网格数据源触发额外的 ajax 过滤器请求

Kendo UI grid data-source triggers extra ajax request on filter

javascript

ajax

kendo-ui

kendo-grid

kendo-datasource