Я использую Bootstrap datepicker.У меня есть выпадающий список (ddinterval) с тремя вариантами «Выбрать», «Еженедельно» и «Ежемесячно».У меня есть текстовое поле для календаря DatePicker.По требованию, при выборе опции «Еженедельно», DatePicker должен иметь нормальный календарь, а при выборе опции «Ежемесячно», DatePicker должен иметь календарь с включенным только днем от 1 до 28 для всего месяца. Я пробовал код ниже, но вывод не согласован.Вся эта функциональность во всплывающем окне медали начальной загрузки.
$(document).ready(function(e) {
var dates_avail = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28];
function isAvailable(date) {
var dt = date.getDate();
if (dates_avail.indexOf(parseInt(dt)) != -1) {
return true;
} else {
return false;
}
}
$('.ddinterval').on('change', function(e) {
$(".dpstartdatefrom").datepicker("destroy");
if ($('.ddinterval').val() == "Monthly") {
$('.dpstartdatefrom').datepicker({
format: 'dd/mm/yyyy',
beforeShowDay: isAvailable
}).on('changeDate', function() {
$(this).datepicker('hide');
});
} else if ($('.ddinterval').val() == "Weekly") {
$('.dpstartdatefrom').datepicker({
format: 'dd/mm/yyyy'
}).on('changeDate', function() {
$(this).datepicker('hide');
});
} else {
$('.dpstartdatefrom').datepicker({
format: 'dd/mm/yyyy'
});
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.min.css" />
<select class="form-control cmbcrinterval ddinterval" id="cmbcrinterval" name="cmbcrinterval">
<option value="">Select</option>
<option value="Weekly" >Weekly</option>
<option value="Monthly" >Monthly</option>
</select>
<input type="text" readonly="true" class="form-control datePicker dpstartdatefrom" id="txtstartdatefrom" name="txtstartdatefrom">