2015-05-20
jQuery覚書 Datetimepicker
日付と時刻両方設定できるJavaScriptのカレンダーを探していたところ
なるものを発見。jQueryのPlug-inとのこと。
早速ダウンロードして、サンプルを参考に設定していく。
いとも簡単に、日付と時刻が設定できた。分間隔もOptionで設定できる。
で、これって日付設定もできるんだよねぇ・・・(要は時刻設定は要らない!の場合)
って「timpicker:false」にするとできたことはできたんだけど、日付をクリックしてもカレンダーが消えてくれないのね。
困ったわぁ~と昼下がりに物思いにふける主婦の体(テイ)で、細かく説明を読んでみる。
すると、日付を選択したときのイベントみたいなものがあるではないか!
よし!
「onSelectDate」で、カレンダーを閉じる処理を追加しちゃえ!
ということで、以下のような設定で、うまいこと日付選択時もカレンダーが消えてくれましたとさ。
// HTML側は <input type="textbox" id="kaishibi" value />
$('#kaishibi').datetimepicker({
dayOfWeekStart : 0 ,
lang:'ja' ,
value:'' ,
format:'Y/m/d',
formatDate:'Y/m/d',
timepicker: false ,
onSelectDate:function(ct,$i){
$('#kaishibi').datetimepicker('hide')
},
});