Bootstrap Datepicker Только год без привязки

Question

В моем проекте MVC в моей модели есть свойство Datetime, допускающее обнуляемое значение: ReplacementDate.

На мой взгляд, у меня есть средство выбора даты Bootstrap (версия 2.0), которое инициализируется с использованием следующего кода:

$('.input-group.decade').datepicker({
            format: "yyyy",
            viewMode: "years",
            minViewMode: "years",
            keyboardNavigation: false,
            forceParse: false,
            autoclose: true,
            showOnFocus: false
});

Средство выбора даты отображается правильно на экране, и я могу выбрать только значение года из календаря. Но когда я публикую данные формы, свойство ReplacementDate не имеет значения. Я попытался установить формат "yyyy", "yyyy" и даже "YYYY", но, похоже, ничто не позволяет привязке произойти.

Странно, у меня есть еще один указатель даты на той же странице, который позволяет пользователю выбрать месяц и год, и он правильно связывается при отправке в другое свойство даты, допускающее обнуляемость. Код для этого выглядит следующим образом:

$('.input-group.month').datepicker({
            format: "mm/yyyy",
            viewMode: "months",
            minViewMode: "months",
            keyboardNavigation: false,
            forceParse: false,
            autoclose: true,
            showOnFocus: false
});

Что я делаю не так, чтобы остановить правильное связывание значения ReplacementDate? Должен ли я сделать ReplacementDate обнуляемым int или чем-то еще?

Answer 1

Я изменил свойство ReplacementDate DateTime на int, и оно связалось. Я не знаю, почему это не связывалось, когда это было DateTime высказывание, поскольку версия ММ / ГГГГ связывалась отлично как DateTime.

Answer 2

Я бы предложил сделать это так:

$('#date1').datepicker({
  changeMonth: true,
  changeYear: true,
  showButtonPanel: true,
  dateFormat: 'yy',
  onClose: function(dateText, inst) {
    var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
    $(this).datepicker('setDate', new Date(year));
    console.log($("#ui-datepicker-div .ui-datepicker-year :selected").val())
  }
});

#ui-datepicker-div {
  font-size: 12px;
}

.ui-datepicker-calendar {
  display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/vader/jquery-ui.min.css" />
<input type="text" id="date1" name="date1" />