如何在弹出窗口外单击时使kendo弹出编辑器自动关闭?

时间:2016-12-26 03:25:59

标签: javascript kendo-ui kendo-grid

我以这种方式使用kendo ui popup编辑器:

    editable: {
        mode: "popup",
        window: {
            actions: [],
            title: false,
            modal: false,
            resizable: false,
            animation: false,
            clickOutside: true
        }

我不知道是否可以通过可编辑配置使弹出窗口自动关闭

我尝试添加autoHide:trueautoClose: true配置,但它不起作用。

2 个答案:

答案 0 :(得分:1)

我知道这是一个老问题,但也许有人可以从中受益:

$("#btnSave").kendoButton({
    click: function (e) {
        e.preventDefault();
        var dialog = $("#dialog").data("kendoWindow");
        dialog.center();
        dialog.open();
    }
});

$("#dialog").kendoWindow({
    width: 225,
    height: 70,
    modal: true,
    visible: false,
    title: false,
    actions: [],
    open: function() {
        setTimeout(function () {
            $("#dialog").data("kendoWindow").close();
        }, 2000);
    },
    animation: {
        open: { effects: "fade:in"},
        close: { effects: "fade:out"}
    }
});

答案 1 :(得分:0)

以防任何人感到懒惰,以下是关闭弹出式编辑窗口的方法:

$(document).on('click', function (e) {
    //kendo popup edit window selector
    var windowCont = $('.k-popup-edit-form.k-window-content');

    //if it was first click on kendo grid edit button exit function
    //otherwise popup window will be closed immidiatelly 
    if ($('.k-grid-edit').is(e.target))
        return;

    //if click was outside popup window, trigger close button
    if (!windowCont.is(e.target) && windowCont.has(e.target).length === 0)
        windowCont.find('.k-grid-cancel').click();
})