问题是,如何在fullcalendar月/周视图中禁用PAST DATES上的可选项。
我想用户不允许点击/选择过去的日期。
这是我试图在事件呈现上实现的一些谷歌搜索代码片段:
selectable: true,
selectHelper: false,
select: function(start, end, allDay) {
var appdate = jQuery.datepicker.formatDate('<?php echo $DPFormat; ?>', new Date(start));
jQuery('#appdate').val(appdate);
jQuery('#AppFirstModal').show();
},
eventRender: function(event, element, view)
{
var view = 'month' ;
if(event.start.getMonth() !== view.start.getMonth()) { return false; }
},
但它不起作用。
我也尝试过贬低CSS,这有助于我隐藏过去的日期文本,但是可选择仍在使用过时日期框。
.fc-other-month .fc-day-number {
display:none;
}
我真的很困惑这个问题。请有人帮助我。谢谢...
我已经在我的完整日历中完成了这项工作,并且它运行良好。
您可以在select函数中添加此代码。
select: function(start, end, allDay) {
var check = $.fullCalendar.formatDate(start,'yyyy-MM-dd');
var today = $.fullCalendar.formatDate(new Date(),'yyyy-MM-dd');
if(check < today)
{
// Previous Day. show message if you want otherwise do nothing.
// So it will be unselectable
}
else
{
// Its a right date
// Do something
}
},
我希望它会对你有所帮助。
这就是我目前正在使用的
还添加了.add()函数,以便用户无法在同一时间添加事件
select: function(start, end, jsEvent, view) {
if(end.isBefore(moment().add(1,'hour').format())) {
$('#calendar').fullCalendar('unselect');
return false;
}
我一直在使用validRange
选项。
validRange: {
start: Date.now(),
end: Date.now() + (7776000) // sets end dynamically to 90 days after now (86400*90)
}
*You can use this*
var start_date= $.fullCalendar.formatDate(start,'YYYY-MM-DD');
var today_date = moment().format('YYYY-MM-DD');
if(check < today)
{ alert("Back date event not allowed ");
$('#calendar').fullCalendar('unselect'); return false
}
在Fullcalendar中,我通过dayClick事件实现了它。我认为这是一种简单的方法。
这是我的代码..
dayClick: function (date, cell) {
var current_date = moment().format('YYYY-MM-DD')
// date.format() returns selected date from fullcalendar
if(current_date <= date.format()) {
//your code
}
}
希望它有助于过去和未来的日期将无法选择..
如果任何一个答案不适合你,请尝试这个,我希望它的工作适合你。
select: function(start, end, allDay) {
var check = formatDate(start.startStr);
var today = formatDate(new Date());
if(check < today)
{
console.log('past');
}
else
{
console.log('future');
}
}
并创建日期格式的功能,如下所示
function formatDate(date) {
var d = new Date(date),
month = '' + (d.getMonth() + 1),
day = '' + d.getDate(),
year = d.getFullYear();
if (month.length < 2) month = '0' + month;
if (day.length < 2) day = '0' + day;
return [year, month, day].join('-');
}
我已经尝试了以上所有问题但不适合我
如果任何其他答案适合您,您可以试试这个。
谢谢
我喜欢这种方法:
select: function(start, end) {
if(start.isBefore(moment())) {
$('#calendar').fullCalendar('unselect');
return false;
}
}
它基本上会禁用“现在”之前的选择。
感谢this answer,我找到了以下解决方案:
$('#full-calendar').fullCalendar({
selectable: true,
selectConstraint: {
start: $.fullCalendar.moment().subtract(1, 'days'),
end: $.fullCalendar.moment().startOf('month').add(1, 'month')
}
});
你可以结合:
- 如上所述,通过CSS隐藏文本
-disable PREV button on current month
-dayck dateClick / eventDrop等:
dayClick: function(date, allDay, jsEvent, view) {
var now = new Date();
if (date.setHours(0,0,0,0) < now.setHours(0,0,0,0)){
alert('test');
}
else{
//do something
}
}
在FullCalendar v3.0中,有属性selectAllow:
selectAllow: function(info) {
if (info.start.isBefore(moment()))
return false;
return true;
}
我尝试过这种方法,效果很好。
$('#calendar').fullCalendar({
defaultView: 'month',
selectable: true,
selectAllow: function(select) {
return moment().diff(select.start) <= 0
}
})
请享用!
下面是我现在使用的解决方案:
select: function(start, end, jsEvent, view) {
if (moment().diff(start, 'days') > 0) {
$('#calendar').fullCalendar('unselect');
// or display some sort of alert
return false;
}
不需要长程序,只需试一试。
checkout.setMinSelectableDate(Calendar.getInstance().getTime());
Calendar.getInstance().getTime()
给我们当前的日期。
在fullcalendar 3.9中,您可能更喜欢validRange function parameter
:
validRange: function(nowDate){
return {start: nowDate} //to prevent anterior dates
},
缺点:这也隐藏在该日期时间之前的事件