日付範囲の選択時にブートストラップ日付ピッカーが表示されない

Question

私はブートストラップdatepickerを使用しています。今、私はdatePickerが非表示にする "カスタム"以外の日付範囲を選択します。私は、「カスタム」以外のオプションを選択して、よりだから

$('#demo').daterangepicker({ 
    ranges: { 
     "autoApply": true, 
     "setDate": new Date(), 
     "dateFormat": 'yy-mm-dd', 
     'Today': [moment(), moment()], 
     'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], 
     'Last 7 Days': [moment().subtract(6, 'days'), moment()], 
     'Last 30 Days': [moment().subtract(29, 'days'), moment()], 
     'This Month': [moment().startOf('month'), moment().endOf('month')], 
     'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')] 
    }, 
    applyOnMenuSelect: false, 
    "alwaysShowCalendars": true, 
    "opens": "left", 
    "applyClass": "btn-primary", 
    "cancelClass": "hide-btn", 
    "startDate": "04/14/2016", 
    "endDate": "04/14/2016", 
    "maxDate": "04/14/2016", 
}, function(start, end, label) { 
    console.log("New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + 
     end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')"); 
}); 

Answer 1

を「適用」をクリックの上に閉じたときに見える、それを維持したい、あなたの問題は、事前定義の範囲がちょうど適用するように送信ボタンとして考えられているということですボタン！そのため、範囲のいずれかをクリックするとカレンダーが非表示になります。

あなたはカレンダーがライブラリから show.daterangepickerイベントを使用して示されているときに、あなたのコードは、残念ながら、あなたはクリックを追加することはできません。この

$('#demo').on('show.daterangepicker',function(){ 
    // here we will add a class with display!important in it 
    $('.daterangepicker').addClass('ishow'); 
}); 

ようになりますdisplay: block!importantを追加するようになった最初の欲しいものを達成するため、ボタンに直接イベントを送信するので、代表団を使用し、幸いなことにjQueryは簡単な実装を得ました。

$('body').delegate(".applyBtn", "click",function(){ 
    // this will be called when the apply button is clicked 
    // we will remove the ishow class to hide the menu! 
    $('.daterangepicker').removeClass('ishow'); 
}); 

それ！それがあなたのプロジェクトであなたを助けてくれることを願って、ここにworking fiddleがあります。

P.S.：以前のようにautoApplyオプションを使用しないでください。