jQuery datepicker 연도 표시 사용하면 표시되는

jQuery datepicker를 사용하면 표시되는 연도 범위를 어떻게 변경합니까? jQuery UI 사이트에서 기본값은 “현재 연도 전후 10 년 표시”입니다. 나는 이것을 생일 선택에 사용하고 싶습니다. 그리고 10 년 전 오늘은 좋지 않습니다. jQuery datepicker로이 작업을 수행 할 수 있습니까? 아니면 다른 솔루션을 사용해야합니까?

datepicker 데모 링크 : http://jqueryui.com/demos/datepicker/#dropdown-month-year



답변

데모 페이지를 조금 아래로 보면 “Restricting Datepicker”섹션이 표시됩니다. 드롭 다운을 사용하여 ” Year dropdown shows last 20 years“demo 를 지정하고 소스보기를 누르십시오.

$("#restricting").datepicker({
    yearRange: "-20:+0", // this is the option you're looking for
    showOn: "both",
    buttonImage: "templates/images/calendar.gif",
    buttonImageOnly: true
});

당신은 (분명 변화 동일한 작업을 수행 할 수 있습니다 -20-100또는 무언가).


답변

연도 또는 월 선택 상자를 표시하지 않는 이유는 무엇입니까?

$( ".datefield" ).datepicker({
    changeMonth: true,
    changeYear: true,
    yearRange:'-90:+0'
});


답변

아무도 입력하지 않은 것은 하드 코딩 된 날짜 범위를 설정할 수도 있다는 것입니다.

예를 들면 :

yearRange: "1901:2012"

이를 수행하지 않는 것이 좋을 수 있지만 이는 완벽하게 유효한 옵션입니다 ( “1963 : 1984″와 같이 카탈로그에서 특정 연도를 합법적으로 찾는 경우 유용함).


답변

생년월일 필드 (그리고 내가 사용하는 것)에 대한 완벽한 것은 Shog9가 말한 것과 비슷하지만 더 구체적인 생년월일 예를 제공 할 것입니다.

$(".datePickerDOB").datepicker({
    yearRange: "-122:-18", //18 years or older up to 122yo (oldest person ever, can be sensibly set to something much smaller in most cases)
    maxDate: "-18Y", //Will only allow the selection of dates more than 18 years ago, useful if you need to restrict this
    minDate: "-122Y"
});

미래의 Google 사용자가이 정보를 유용하게 사용하기를 바랍니다. :).


답변

@ Shog9가 게시 한 내용에 추가하여 beforeShowDay : 콜백 함수에서 개별적으로 날짜를 제한 할 수도 있습니다.

날짜를 취하고 부울 배열을 반환하는 함수를 제공합니다.

"$(".selector").datepicker({ beforeShowDay: nationalDays})
natDays = [[1, 26, 'au'], [2, 6, 'nz'], [3, 17, 'ie'], [4, 27, 'za'],
[5, 25, 'ar'], [6, 6, 'se'], [7, 4, 'us'], [8, 17, 'id'], [9, 7,
'br'], [10, 1, 'cn'], [11, 22, 'lb'], [12, 12, 'ke']];
function nationalDays(date) {
    for (i = 0; i < natDays.length; i++) {
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() ==
natDays[i][1]) {
        return [false, natDays[i][2] + '_day'];
      }
    }
  return [true, ''];
}


답변

 $("#DateOfBirth").datepicker({
        yearRange: "-100:+0",
        changeMonth: true,
        changeYear: true,
    });

yearRange : ‘1950 : 2013’, // 하드 코딩 된 연도 범위 지정 또는이 방법

yearRange : “-100 : +0”, // 지난 100 년

연도 및 월 선택에 대한 드롭 다운을 표시하는 데 도움이됩니다.


답변

au, nz, ie 등은 국경일이 표시되는 국가 (호주, 뉴질랜드, 아일랜드 등)의 국가 코드입니다. 코드에서 볼 수 있듯이 이러한 값은 ‘_day’와 결합되어 CSS 스타일로 해당 날짜에 적용되도록 다시 전달됩니다. 해당 스타일은 아래에 표시된 형식으로, 그 날의 텍스트를 이동시키고 국가 국기 이미지로 대체합니다.

.au_day {
  text-indent: -9999px;
  background: #eee url(au.gif) no-repeat center;
}

새 스타일로 다시 전달되는 ‘false’값은 요즘 선택되지 않을 수 있음을 나타냅니다.