Получить дату из bootstrap-datepicker и распечатать отдельно - PullRequest
0 голосов
/ 19 сентября 2019

Я использую Bootstrap Date picker.Я хочу получить значение даты (20 сентября 19) и напечатать его в трех разных div (чтобы я мог по-разному их стилизовать).

<div class="input-group date">
  <input type="hidden" id="date-input" value="20-Sep-19" class="form-control">
  <div id="div1">20 </div>
  <div id="div2">Sep'19</div>
  <div id="div3">Wednesday</div>
</div>

$(function(){
  $('.input-group.date').datepicker({
  format: 'dd-M-yy',
  todayHighlight: true,
  autoclose: true});
});

Я пробовал некоторые jquery, но не работает.

$(document).on("change", "#date-input", function () {
  var date = new Date($('#date-input').val());
  day = date.getDate();
  month = date.getMonth() + 1;
  year = date.getFullYear();
  alert([day, month, year].join('/'));

});

Каждый знает, как этого можно достичь.Заранее спасибо.

1 Ответ

2 голосов
/ 19 сентября 2019

Проверьте эту скрипку для быстрого внедрения.

Ваш Javascript должен будет проанализировать данные, отправленные обратно из события dateChange элемента datepicker

picker.on("changeDate", function(e) {
        div1.text(e.date.getDate());

        var month = getMonthName(e.date.getMonth());
        var year = ("" + e.date.getYear()).substr(1, 3);
                div2.text(month + " '" + year);

        div3.text(getDayOfWeek(e.date.getDay()));
    });

Функции getMonthName и getDayOfWeek просто принимают целое число и возвращают соответствующий месяц / день.

По звукам вещей вы относительно новичок в Javascript.Я настоятельно рекомендую вам полностью понять, как использовать Javascript и jQuery.Для получения дополнительной информации см. Следующие ресурсы:
* JS Дата и утилиты
* jQuery .text ()
* Bootstrap-datepicker changeDate документация

...