jQueryUI には、アイコン トリガーを備えた優れた DatePicker があります(カレンダー アイコンでカレンダーが開きます。Outlook と同様の動作です)。
一方、Bootstrap 3 の入力グループは、アイコンを入力フィールドに接続するのに非常に便利です。
どちらか一方を書き換えずに、2 つを組み合わせることができますか?
ここで JSFiddleを作成しました。«開始日» の場合、jQueryUI アイコン トリガーはアクティブではありません。«終了日» では有効になっています。残念ながら、DatePicker アイコンは終了日の入力グループの外に表示されます。
では、アイコン トリガーを入力グループの一部として有効にすることは可能ですか («Start Date» のように見えますが、«End Date» のように動作します)。
メイン アイコン トリガー コード:
$("#datepicker-end").datepicker({
showOn: "button",
buttonImage: "img/calendar.gif",
buttonImageOnly: true
});
メイン入力グループ コード:
<div class="input-group">
<input type="text" id="datepicker-start" class="form-control" placeholder="Start Date" />
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div>