jquery - jQuery datepicker 年表示

Question

jQuery datepicker を使用して、表示される年の範囲を変更するにはどうすればよいですか? jQuery UIサイトでは、デフォルトは「現在の年の前後10年を表示する」と書かれています。誕生日のセレクションに使いたいのですが、10年前の今日はダメです。これは jQuery datepicker で行うことができますか、それとも別のソリューションを使用する必要がありますか?

datepicker デモへのリンク: http://jqueryui.com/demos/datepicker/#dropdown-month-year

score 165 · Accepted Answer

デモページを少し下に見ると、「日付ピッカーの制限」セクションが表示されます。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

score 40 · Accepted Answer

年または月の選択ボックスを表示しないのはなぜですか?

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

score 10 · Accepted Answer

ハードコーディングされた日付範囲を設定することもできます。

例えば：

yearRange: "1901:2012"

これを行わないことをお勧めしますが、これは完全に有効なオプションです (「1963:1984」など、カタログで特定の年を合法的に探している場合に役立ちます)。

score 6 · Accepted Answer

生年月日フィールド（および私が使用するもの）に最適なのは、Shog9が言ったことに似ていますが、より具体的なDOBの例を挙げます。

$(".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"
});

将来のグーグル社員がこれを役に立つことを願っています:)。

score 5 · Accepted Answer

@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, '']; 
}

score 3 · Accepted Answer

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

yearRange: '1950:2013', // ハードコードされた年の範囲を指定するか、この方法で

yearRange: "-100:+0", // 過去 100 年

年と月を選択するためのドロップダウンを表示すると役立ちます。

jquery - jQuery datepicker 年表示

8 に答える 8

Related

Reference