Как отображать диапазон лет во входном Bootstrap Datepicker?

1

Я использую следующий код для отображения диапазона лет:

 $('.date-own').datepicker({
    format: " yyyy",
    viewMode: "years",
    minViewMode: "years",
    autoclose: true,
    startView: 2,
    yearRange: '1950:2011'
});

Но ассортимент не приближается.

Как я могу решить эту проблему, если мне нужен только год с 1950 по 2010 год?

Теги:
bootstrap-4 datepicker bootstrap-datepicker
CodeFix

1 ответ

1
Лучший ответ

В вашем datepicker вы можете использоватьstartDate иendDate и там вы можете указать, через сколько лет, то есть:1950-2021 = -71y установить startDate и то же самое для других.

Демо-код :

$('.date-own').datepicker({
  format: "yyyy",
  viewMode: "years",
  updateViewDate: true,
  minViewMode: "years",
  autoclose: true,
  startView: 2,
  defaultViewDate: {
    year: '1950'
  },
  startDate: '-71y', //2021 -1950
  endDate: '-10y' //2021-2011
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.css" />
<input type="text" class="date-own">

Поделиться
Источник
  • 0
    Это работает. Спасибо, @swati.
  • 0
    Мне также нужна еще одна услуга: мы активируем 1950 год по умолчанию и показываем только дату начала и дату окончания только в календаре
  • 1
    Видишь, у меня есть обновление. Но не уверен насчет второй проблемы, так как год уже отключен.
  • 1
    спасибо, и я нахожу решение второй проблемы с помощью CSS. .datepicker table tr td span.disabled, .datepicker table tr td span.disabled: hover {display: none; }

Другие вопросы

  • ajax дважды загружает данные из базы данных с помощью laravel php1 ответ

    привет, я пытаюсь загрузить данные из базы данных с помощью ajax. но данные загружаются дважды на страницу html.<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $('button').click(function(){ $.ajax({ ...

  • Нижний колонтитул мерцает при переходе на разные страницы1 ответ

    У меня есть следующая разметка для отображения фиксированного нижнего колонтитула в основном макете:<nav class="main-footer navbar navbar-expand navbar-white navbar-light" style="height: 40px;"> <ul class="navbar-nav"> <li class="nav-item...

  • Оператор if в jQuery и HTML?2 ответ

    Я успешно запускаю следующий скрипт: он обновляет текст каждые 3 секунды.<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <script> $(function() { window.setInterval(function() { loadNewText() }, 3000) function loadNewText...

  • Добавление ссылки на dll в Javascript1 ответ

    Может ли кто-нибудь предложить вариант добавления ссылки на DLL в Javascript. Я работаю над приложением javascript, в котором мы пытаемся получать события с сервера напрямую, без .Net / Java. Я пробовал использовать ActiveXObject, но он не поддерживается в текущих браузерах...

  • Как отображать данные SQL в HTML в виде таблицы с помощью AJAX JQuery?1 ответ

    У меня есть некоторые данные, хранящиеся в файле SQL, и я хочу отображать данные в HTML в виде таблицы с AJAX JQuery. Когда я их проверяю, данные получаются нормально, но я не понимаю, как я могу отображать данные в HTML. Для меня все является новой концепцией, и мне трудно найти правильный способ с...

  • анимация скольжения с анимацией fadeIn для перехода к следующей форме1 ответ

    Я пытаюсь создать анимацию для события нажатия кнопки, чтобы сдвинуть форму, затем вызвать следующую форму, она также сдвинется вверх и вызовет следующую форму, но моя форма исчезает после одной анимации слайда и не показывает никаких форм. script.js файл есть.jQuery(document).ready(function(){ //M...

  • Отправить значение ползунка jQuery с помощью AJAX1 ответ

    Я отправляю две переменные jQuery (urlid а такжеbonus ) с AJAX в серверный скрипт. Это работает, как ожидалось. Теперь я хочу добавить слайдер jQuery (#slider-vertical ) к сценарию. Фактическое выбранное значение ползунка должно быть отправлено с помощью AJAX. Я пробовал вот так, но значение ползунк...

  • jQuery-UI Autocomplete - SyntaxError: неожиданный идентификатор1 ответ

    Я получаю SyntaxError, которого я не понимаю с помощью автозаполнения jQuery-UI. Вот мой код: PHP$productsAutocomplete = array(); foreach($products as $product){ array_push($productsAutocomplete, $product['denomination']); } //$products => datas from database. jQueryfunction autocomplete_p...

  • Как запустить проверку в мастере при нажатии кнопки «Далее»?1 ответ

    В приложении Laravel 8, которое использует vuejs и jquery, я обнаружил мастер, созданный с помощью html, например:<div class="content__inner"> <div class="ccontainer overflow-hiddenn"> <!--multisteps-form--> <div class="multisteps-for...

  • Как я могу проверить, является ли переменная «неопределенной» или «нулевой», не объявляя ее [дубликат]1 ответ

    На этот вопрос уже есть ответы здесь : JavaScript проверяет, существует ли переменная (определена / инициализирована) (31 ответ) Закрыт 12 дней назад . Я используюjson массив в моем внешнем файле js. Этот массив объявлен некоторыми обязательными страницами, а не всеми моими страницами. Моя проблема...

CodeFix
Цитата дня

"Завидую тестировщикам: все хотят с ними дружить."

Эндрю Таненбаум