Jquery ui датаpicker день/месяц только, не год выбор

Я искал здесь в SO и все вокруг, но не нашел подходящих решений для этой проблемы. С jQueryUI DatePicker мне нужно выбрать рекурсивную дату на все годы, поэтому я не хочу показывать год выбора, потому что это не имеет смысла.

Как я могу получить это внутри вызова, как показано ниже?

$('#myInput').datepicker({ dateFormat: "dd/mm" });

Примечание. Я не могу использовать решение css, предложенное здесь .ui-datepicker-year{ display:none; }, потому что на той же странице есть другие датапикеры.

Любая помощь будет оценена.

Спасибо заранее.

Ответы

Ответ 1

HIya попробуйте это демонстративно: http://jsfiddle.net/rAdV6/20/ вот что вам нужно bruv

который когда-либо подходит вам, мужчина:) также см. снимок экрана ниже и, пожалуйста, не забудьте принять и проголосовать, если это поможет:))

Изменить, чтобы уточнить, что это исправление позволит иметь несколько списков выбора даты с или без год сверху в верхней части календаря.

Надеюсь, это поможет! приветствия

код jquery

  $('.DateTextBox.NoYear').datepicker({
            beforeShow: function (input, inst) {
              inst.dpDiv.addClass('NoYearDatePicker');
            },
            onClose: function(dateText, inst){
                inst.dpDiv.removeClass('NoYearDatePicker');
            }
        });

$('#datepicker').datepicker( { changeYear: false, dateFormat: 'dd/mm',});


$('#datepicker1').datepicker( { changeYear: true, dateFormat: 'dd/mm', });

$('#datepicker2').datepicker( { changeYear: false, dateFormat: 'dd/mm', });

Css

 .NoYearDatePicker .ui-datepicker-year
{
 display:none;   
}

HTML

    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all">

date (without year) <input type="text" id="datepicker" class="DateTextBox NoYear">

<br />
date 1: (With year) <input type="text" id="datepicker1" >
<br />
date 2: (Without year) <input type="text" id="datepicker2" class="DateTextBox NoYear">

Рисунок ниже, чтобы показать, как он также появляется в моей операционной OS OS:)

Ответ 2

Не могли бы вы сделать

#myInput .ui-datepicker-year{ display:none; }

чтобы ограничить его только комментатором даты, о котором вы беспокоитесь?

Ответ 3

Попробуйте следующее:

$("#myInput").datepicker();
$("#myInput").datepicker("option", "dateFormat", "dd/mm");

Как jQuery UI DatePicker Documentaion,

http://docs.jquery.com/UI/Datepicker#option-dateFormat

Вам нужно вызвать функцию ниже в Инициализация.

$("#myInput").datepicker({ dateFormat: "dd/mm" });

Он не будет работать, если вы вызовете его после метода init.

Ответ 4

Основываясь на ответе от Tats_innit, вот решение, которое решает пару его проблем.

$(function() {
  $('.dp').datepicker({
    dateFormat: 'd MM yy',
    beforeShow: function(inp, inst) {
      if (inp.classList.contains("Birthday")) {
        inst.dpDiv.addClass('BirthdayDatePicker');
        return {
          dateFormat: 'MM d',
          defaultDate: new Date(1904, 0, 1),
          minDate: new Date(1904, 0, 1),
          maxDate: new Date(1904, 11, 31),
        };
      }
    },
    onClose: function(dateText, inst) {
      inst.dpDiv.removeClass('BirthdayDatePicker');
    }
  });
});

.BirthdayDatePicker .ui-datepicker-year {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

Birthday: <input type='text' class='dp Birthday' placeholder='Month day'>

<div style="height: 12px" class="spacer"></div>

Defaults: <input type='text' class='dp' placeholder='day Month year'>

Ответ 5

Простое решение для этого:

$(".daypicker").datepicker( { 
    changeYear: false, 
    dateFormat: 'MM-dd',
}).focus(function () {
    $(".ui-datepicker-year").hide();
});

Он не будет влиять на других датпикеров на той же странице.

Ответ 6

Я знаю, это довольно старый вопрос, но, возможно, это будет полезно для кого-то. Если вы установите опцию changeYear: false, вы увидите значение <span> с годовым значением, но если вы установите changeYear: true, вы увидите <select>. Мы можем использовать это различие следующим образом:

$(function() {
  $("#year-datepicker").datepicker({
    changeMonth: true,
    changeYear: true
  });

  $("#no-year-datepicker").datepicker({
    dateFormat: "MM d",
    changeMonth: true,
    changeYear: false
  });
});

span.ui-datepicker-year {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="#" onclick="location.href='https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css'; return false;" />

<p>With year: <input type="text" id="year-datepicker"></p>
<p>Without year: <input type="text" id="no-year-datepicker"></p>