如何通过 Enter 按键在 kendo ui 网格上触发过滤器事件？

Question

我使用 Kendo UI v2014.2.716

我有一个带有服务器端分页、排序、过滤功能的网格，并且我为我的网格启用了过滤行。

当我测试这个过滤器时，我意识到：

• 过滤器在以下情况下启动：
  • 当输入过滤器失去焦点时。
  • 当用户选择过滤菜单项时。
  • 当用户单击“删除过滤器”按钮时。

当在输入过滤器上按下回车键时，这会使页面回发。

但是我希望当在输入过滤器上按下 Enter 键时过滤器会触发。

所以我在列上使用了模板：

                { field: "ShortTitle", title: "Title", filterable: { cell: { template: function (input) { input.width("60%"); input.keydown(preventPost); } }} },

并编写一个函数来防止回发：

function preventPost(e) {
        if (e.keyCode === 13) {
            e.preventDefault();             
        }
    }

但是我不知道当用户按 ENTER 时如何触发事件过滤器。

我尝试在 PreventPost 函数中调用 onblur 但它不起作用。

    function preventPost(e) {
        if (e.keyCode === 13) {
            e.preventDefault();
            this.onblur();
        }
    }

请告诉我如何做到这一点。非常感谢。

Answer 1

您可以在列字段中添加函数

filterable: {
    cell: {
        operator: "contains",
        template: function (args) {
            args.element.css("width", "90%").addClass("k-textbox").keydown(function (e) {
                setTimeout(function () {
                    $(e.target).trigger("change");
                });
            });
        },
        showOperators: false
    }
}

欲了解更多信息，您可以参考此链接 https://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/filtering/grid-filter-as-you-type