kendogrid过滤器菜单在mouseleave上关闭 [英] kendogrid filter menu closing on mouseleave

问题描述

在带有kendogrid.columnMenu: true的kendogrid中，例如 http://jsbin.com/AsEtoDik/2

有一个非常烦人的行为:当您尝试设置过滤器时，鼠标从过滤器面板中移出时，它将关闭.尤其是在日期列上进行过滤时，这种情况经常发生.

我想这是有意的，但不是很用户友好.我曾考虑过在mouseleave事件之后设置一个计时器，以延迟菜单的关闭，但是在jQuery中，它看起来相当困难，我希望能获得一些帮助或建议

解决方案

您可以通过替换Kendo Menu _mouseleave方法(在创建第一个实例之前)来禁用此行为:

kendo.ui.Menu.fn._mouseleave = function() {};

然后，您必须在菜单外部单击以将其关闭(演示). 您可以尝试使用超时的方法，尽管可能会有些复杂.像这样的东西可能有用-尽管没有进行太多测试(演示):

var originalMouseLeave = kendo.ui.Menu.fn._mouseleave;
var mouseLeave = function (e) {
    var that = this;
    clearTimeout(this._timeoutHandle);
    this._timeoutHandle = setTimeout(function () {
        originalMouseLeave.call(that, e);
    }, 1000);
}

kendo.ui.Menu.fn._mouseleave = mouseLeave;

var originalMouseEnter = kendo.ui.Menu.fn._mouseenter;
var mouseEnter = function (e) {
    clearTimeout(this._timeoutHandle);
    originalMouseEnter.call(this, e);
}

kendo.ui.Menu.fn._mouseenter = mouseEnter;

注意:还有 hoverDelay 配置选项，因此您也许可以为此设置默认选项.

in a kendogrid with kendogrid.columnMenu: true like this http://jsbin.com/AsEtoDik/2

there's a very annoying behavior: when you try to set a filter and the mouse goes out of the filter panel, it closes. It happens a lot especially filtering on a date column.

I guess this is intended but it's not very user friendly. I thought about setting a timer after the mouseleave event, delaying the closure of the menu, in jQuery but it looks rather difficult and I'd appreciate some help or suggestion

解决方案

You can disable this behavior by replacing the Kendo Menu _mouseleave method (before you create the first instance):

kendo.ui.Menu.fn._mouseleave = function() {};

Then you'll have to click outside of the menu to close it (demo). You can try your idea with the timeout, although there might be complications; something like this might work - haven't tested much though (demo):

var originalMouseLeave = kendo.ui.Menu.fn._mouseleave;
var mouseLeave = function (e) {
    var that = this;
    clearTimeout(this._timeoutHandle);
    this._timeoutHandle = setTimeout(function () {
        originalMouseLeave.call(that, e);
    }, 1000);
}

kendo.ui.Menu.fn._mouseleave = mouseLeave;

var originalMouseEnter = kendo.ui.Menu.fn._mouseenter;
var mouseEnter = function (e) {
    clearTimeout(this._timeoutHandle);
    originalMouseEnter.call(this, e);
}

kendo.ui.Menu.fn._mouseenter = mouseEnter;

Note: there's also the hoverDelay configuration option, so you may be able to set the default option for that.

这篇关于kendogrid过滤器菜单在mouseleave上关闭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！