Показать окно подтверждения в dhtmlx планировщике на foreforechangechange - PullRequest
Новая
       25

Показать окно подтверждения в dhtmlx планировщике на foreforechangechange

0 голосов
/ 13 июня 2019

Я хочу показать окно подтверждения перед изменением вида.Поэтому, когда пользователь меняет дату для планировщика, я хочу показать окно подтверждения, хочет ли пользователь перенаправить на другую дату или нет.

1 Ответ

0 голосов
/ 14 июня 2019

Самое простое решение - использовать window.confirm

Он приостанавливает выполнение кода, пока пользователь не выберет какую-либо опцию, поэтому вы можете использовать простой оператор if-else: 

scheduler.attachEvent("onBeforeViewChange", function (oldMode, oldDate, mode, date) {
    if (oldMode && oldDate) {
        if (oldMode !== mode || oldDate.valueOf() !== date.valueOf()) {
            if (confirm("are you sure?")) {
                return true;
            }
            return false;
        }
    }

    return true;
});

демо: https://snippet.dhtmlx.com/140d2ff31

Если вам нужно всплывающее окно с пользовательским подтверждением, которое не блокирует браузер, вам нужно сделать небольшой обходной путь, поскольку API планировщика не поддерживает асинхронные обработчики событий:

1) когда код входит в onBeforeViewChange, вы отображаете диалоговое окно и всегда возвращаете false из обработчика, чтобы сохранить ту же дату

2) когда пользователь подтверждает изменение вида - вы устанавливаете флаг для временного отключения шага 1 и вызываете scheduler.setCurrentView из обратного вызова. Снова запускается onBeforeViewChange, вы проверяете установленный флаг и на этот раз возвращаете true, что позволяет изменить дату. 

var callbackViewChange = false;
scheduler.attachEvent("onBeforeViewChange", function (oldMode, oldDate, mode, date) {
    if (oldMode && oldDate) {
        // 
        if (!callbackViewChange && (oldMode !== mode || oldDate.valueOf() !== date.valueOf())) {
            dhtmlx.confirm({
                text: "are you sure?",
                callback: function (result) {
                    if (result) {
                        // set the flag in order to allow view change
                        callbackViewChange = true;
                        scheduler.setCurrentView(date, mode);
                        callbackViewChange = false;
                    }
                }
            });
            // cancel view change while we wait for user action
            return false;
        }
    }
    return true;
});

демо: https://snippet.dhtmlx.com/a2b8b09b9

...