前提・実現したいこと
店舗選択セレクトボックスと、
休業日は選択できない来店日選択インプットボックスを
Bootstrap-DatePickerを使って実装しようとしています。
通過済みの方がいらっしゃれば、ご教授いただけると嬉しいです。
発生している問題・エラーメッセージ
BootStrap-DatePickerのメソッド(setDatesDisabled)を使って
選択不可日を設定すると、月切替ボタン(>>マーク)での月切替をしようとしても、
月表示が変わらなくなってしまいます。
該当のソースコード
html
1<select name="shop_id"> 2 <option value="1">店舗1</option> 3 <option value="2">店舗2</option> 4</select> 5来店日: 6<input type="text" name="reserve_day" class="date-picker" value="" data-datesdisabled="" />
javascript
1<script> 2 function datePickerCallBack(e) { 3 let value = $(this).data('datesdisabled'); 4 $('.date-picker').datepicker('setDatesDisabled', value); 5 } 6 7 $(function(){ 8 $('[name=shop_id]').on('changed', function() { 9 //店舗に応じた休業日を取得して、$('.reserve_day').data('datesdisabled')にセットする 10 }); 11 //date-picker初期化 12 $('.date-picker').datepicker({ 13 format: 'yyyy-mm-dd', 14 language:'ja', 15 autoclose: true, 16 }); 17 //datepicker表示時に選択不可日設定 18 $('.date-picker').on('show', datePickerCallBack); 19 }); 20</script>
試したこと
showイベントのコールバック内で他のメソッドに変えてみても、月選択は無効になったままでした。
showイベントのコールバック内でreturn true;を返してみましたが、月選択は無効になったままでした。
datePickerCallBack内のsetDatesDisabledメソッドを呼んでいる行をコメントアウトすると、月選択は有効でした。
補足情報(FW/ツールのバージョンなど)
jQuery v3.3.1
Datepicker for Bootstrap v1.8.0
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。