JQuery Datepicker на событие изменения не срабатывает при использовании кнопки вместо ввода текста

Question

Я пытаюсь сделать кнопку выбора даты только с помощью jQuery dtaepicker.

Когда я присоединяю указатель даты к входу, функция onchange работает, и я получаю новое выбранное значение.

Однако, когда я присоединяю средство выбора даты только с помощью кнопки или чего-то еще, событие onchange не запускается:

<input type="text" class="test"> // works

<i class="fa fa-calendar test"></i> // opens the datepicker as should be, but not fire the change event

$(function() {
            $(".test").datepicker({
              format: 'yyyy-mm-dd',
              onSelect: function(v) {
                // also not getting fired
              },
            }).on("change", function() {
              // not getting fired when using button instead of text input
              let val = $(this).val();
            });
        });

Answer 1

Я нашел это:

$(".test").datepicker(params).on('hide', v => console.log(v.date));
// will return a date object with the selected date

Answer 2

Я думаю, вам нужно добавить эту строку showOn: 'button'

<input type="text" class="test"> // works

<i class="fa fa-calendar test"></i> // opens the datepicker as should be, but not fire the change event

$(function() {
            $(".test").datepicker({
              showOn: 'button', // use showOn: 'both' if you want to open the datepicker on icon and the input as well
              format: 'yyyy-mm-dd',
              onSelect: function(v) {
                // This would get fired on changing date on the calendar icon
              },
            }).on("change", function() {
              // not getting fired when using button instead of text input
              let val = $(this).val();
            });
        });

Также вы можете удалить тег <i class="fa fa-calendar test"></i> и поместить следующие два LOC после атрибута showOn, чтобы отобразить значок календаря

  buttonImageOnly: true,
  buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif',

Answer 3

Используйте событие hide - оно загорается после того, как вы закончите вставлять или выбирать дату:

$(function() {
            $(".test").datepicker({
              format: 'yyyy-mm-dd',
              onSelect: function(v) {
                // also not getting fired
              },
            }).on("hide", function(e) {
              // not getting fired when using button instead of text input
              let val = $(this).val();
            });
        });

Answer 4

Вы можете попробовать ответ здесь .

Вы должны быть в состоянии вызвать изменение даты выбора из события нажатия кнопки