Навигация с клавиатуры отключена в загрузчике ViewMode datetimepicker

Question

Когда я установил viewMode При выборе опции "годы" я не могу использовать клавиши клавиатуры для перехода между годами, и даже когда я нажимаю клавишу ввода в выбранный по умолчанию год, виджет автоматически закрывается, а он должен перейти в "месяцы". viewMode тогда "дни" viewMode,

Есть ли идея, почему он работает на щелчках, но не с клавиатурной навигацией?

Заранее спасибо.

Answer 1

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

$('#birthday').datetimepicker(
    {
        format: 'DD-MM-YYYY',
        locale:'fr',
        viewMode:'years'
    }).on('dp.show',function(e) 
    {
        document.removeEventListener("keydown", SubscripKeyDownHandler);
        $(this).data("DateTimePicker").keyBinds({
            up: function (widget) {
                if($('#birthday').data('DateTimePicker').viewMode()=="years")
                {
                    // console.log('years');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().subtract(4, 'y'));
                    } else {
                        this.date(this.date().clone().add(1, 'h'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="months")
                {
                    // console.log('months');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().subtract(4, 'M'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="days")
                {
                    // console.log('days');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().subtract(7, 'd'));
                    } else {
                        this.date(this.date().clone().add(1, 'm'));
                    }
                }
            },
            down: function (widget) {
                if($('#birthday').data('DateTimePicker').viewMode()=="years")
                {
                    // console.log('years');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().add(4, 'y'));
                    } else {
                        this.date(this.date().clone().subtract(1, 'h'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="months")
                {
                    // console.log('months');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().add(4, 'M'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="days")
                {
                    // console.log('days');
                    if (!widget) {
                        this.show();
                    }
                    else if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().add(7, 'd'));
                    } else {
                        this.date(this.date().clone().subtract(1, 'm'));
                    }
                }
            },
            left: function (widget) {
                if($('#birthday').data('DateTimePicker').viewMode()=="years")
                {
                    // console.log('years');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().subtract(1, 'y'));
                    } else {
                        this.date(this.date().clone().add(1, 'h'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="months")
                {
                    // console.log('months');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().subtract(1, 'M'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="days")
                {
                    // console.log('days');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().subtract(1, 'd'));
                    }
                }
            },
            right: function (widget) {
                if($('#birthday').data('DateTimePicker').viewMode()=="years")
                {
                    // console.log('years');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().add(1, 'y'));
                    } else {
                        this.date(this.date().clone().subtract(1, 'h'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="months")
                {
                    // console.log('months');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().add(1, 'M'));
                    }
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="days")
                {
                    // console.log('days');
                    if (widget.find('.datepicker').is(':visible')) {
                        this.date(this.date().clone().add(1, 'd'));
                    }
                }
            },
            enter: function (widget) {
                if($('#birthday').data('DateTimePicker').viewMode()=="years")
                {
                    setTimeout(function(){
                        $('#birthday').data('DateTimePicker').viewMode('months');
                      },1);
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="months")
                {
                    setTimeout(function(){
                        $('#birthday').data('DateTimePicker').viewMode('days');
                      },1);
                }
                else if($('#birthday').data('DateTimePicker').viewMode()=="days")
                {
                    this.hide();
                }
                console.log($('#birthday').data('DateTimePicker').viewMode());
            }
        });
    }).on('dp.hide',function(e)
    {
        //You can add this line of code to fix this issue:
        //The year viewMode is set the first time you open the datetimepicker 
        //and can't be set if you opened it again 
        setTimeout(function(){
            $('#birthday').data('DateTimePicker').viewMode('years');
          },1);
        document.addEventListener("keydown", SubscripKeyDownHandler);
    }).on("dp.change", function (e) {
    });