我正在使用eternicode bootstrap-datepicker;
我想知道如何配置Bootstrap Datepicker来限制要选择的可用日期.我的观点是,某些数据在特定日期准备就绪.该日期可由用户选择.
目前,我将在7天后限制.但是,星期六和星期日是从未有过一些数据的日子;
通过这种方式,我可以显示一系列日期,但这些范围之间没有“漏洞”.所以,我想知道如何配置Bootstrap Datepicker来限制从用户中选择的可用日期.
解决方法
我检查过Bootstrap本身没有内置的datepicker.如果你在谈论
eternicode写的
bootstrap-datepicker third party library ..我相信它支持与jquery datepicker相同的事件..所以：
beforeShowDay
功能(日期).默认值：$.noop
将日期作为参数并返回以下值之一的函数：
>未定义无效
>一个布尔值,指示此日期是否可选
>一个String,表示要应用于日期单元格的其他CSS类
>具有以下属性的对象：
> enabled：与上面的布尔值相同
> classes：与上面的String值相同
>工具提示：通过标题HTML属性应用于此日期的工具提示
使用类似这样的东西(下面的例子只允许周末和下面的自定义数组中的两个日期被选中)：
// use this to allow certain dates only
var availableDates = ["15-1-2014","16-1-2014"];
$(function()
{
$('#txtDate').datepicker({
beforeShowDay:
function(dt)
{
// use dt.getDay() to restrict to certain days of the week
// or a custom function like "available" below to do more complex things
return [dt.getDay() == 0 || dt.getDay() == 6 || available(dt),"" ];
}
});
});
function available(date) {
dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
if ($.inArray(dmy,availableDates) != -1) {
return true;
} else {
return false;
}
}
最后,一个working FIDDLE to show above in action ..使用jquery datepicker,但相同的区别……
