我的页面中有一个datepicker
,我也有两个单选按钮,如下所示。
<input type="radio" name="radio1" value="radio1" checked> Radio 1
<input type="radio" name="radio2" value="radio2" >Radio 2
我的datepicker html是:
<input
type="text"
id="mydatepicker"
aria-controls="sample_1"
class="form-control input-small input-inline" >
我的JS代码是:
$('#mydatepicker').datepicker({
format: 'dd/mm/yyyy',
beforeShowDay: EnableDisableDates
});
function EnableDisableDates(date) {
var formattedDate = $.datepicker.formatDate('dd/mm/yy', date);
if ($("#radio1").is(':checked') == false) {
if (date < Date.parse('11/23/2015'))
return {enabled: false};
}
else {
return [true];
}
}
我想显示选择广播1 的所有日期,我想在选择单选按钮2 (广播2)时停用日期 2015年11月23日之前 () 。
以上是我的情景。
我的问题是:
第一次加载时,它对 Radio 1 工作正常,即它启用 Radio 1 的所有日期。
在选择广播2 时,它没有在datepicker中调用 beforeShowDay
属性的EnableDisableDates方法。
我不知道为什么不调用这个方法。帮助我摆脱这个问题。
答案 0 :(得分:1)
你可以使用minDate来禁用日期,而不是手动执行,这将花费成本:
试试这个:
<强> JS 强>
$(function() {
$(".radio1").change(function () {
if($(".radio1:checked").val()=="radio2"){
$('#mydatepicker').datepicker('destroy');
$('#mydatepicker').datepicker({
format: 'dd/mm/yyyy',
minDate: '11/23/2015'
});
}else{
$('#mydatepicker').datepicker('destroy');
$('#mydatepicker').datepicker({
format: 'dd/mm/yyyy',
});
}
});
$('#mydatepicker').datepicker({format: 'dd/mm/yyyy'});
});
<强> HTML:强>
<input type="radio" class="radio1" name="radio1" value="radio1" checked> Radio 1
<input type="radio" class="radio1" name="radio1" value="radio2" >Radio 2<input
type="text"
id="mydatepicker"
aria-controls="sample_1"
class="form-control input-small input-inline" >
更新
我们已经使用destroy来创建datepicker的新实例 jQuery DatePicker -- Changing minDate and maxDate on the fly看到这个
答案 1 :(得分:0)
我遇到了类似的问题。就我而言,这是一个下拉列表,根据该下拉列表,我禁用了日期选择器中的某些日期。它为我所做的更改而努力。但是对于第二次更改,它不起作用。
最后,我得到的解决方案是datepicker('remove')。
因此,这只需在change函数中添加一行代码即可。
$('#mydatepicker').datepicker('remove');
所以您的代码应该这样:
$(".radio1").change(function () {
$('#mydatepicker').datepicker('remove');
if($(".radio1:checked").val()=="radio2"){
$('#mydatepicker').datepicker('destroy');
$('#mydatepicker').datepicker({
format: 'dd/mm/yyyy',
minDate: '11/23/2015'
});
}else{
$('#mydatepicker').datepicker('destroy');
$('#mydatepicker').datepicker({
format: 'dd/mm/yyyy',
});
} });