在周末禁用事件创建答案

【问题标题】：Disable event creation on Weekends在周末禁用事件创建
【发布时间】：2017-07-30 07:04:02
【问题描述】：

我正在尝试将 Fullcalendar 用于我的一个休假申请。我启用了选择选项，以便用户可以选择日期并申请休假。但我想禁止周末被选中，即当用户点击周末时它应该发出警报。可以实现吗？

我的代码

this.calendarOptions = {
    height:450,
    defaultDate: moment(new Date(),'YYYY-MM-DD'),
    editable: false,
    stick:true,
    selectable:true,
    eventLimit: false, // allow "more" link when too many events
    events: this.eventList,
    header: {
        left: 'month basicWeek basicDay',
        center: 'title',
        right: 'today prev,next'
    },
    displayEventTime: false,

    select: (start, end, allDay) => {
        this.startDate=moment(start).format("YYYY-MM-DD");
        this.endDate=moment(end).format("YYYY-MM-DD");   
        $('.first.modal').modal('show');
    },
    dayRender: (date, cell)=> {
    //logic
    },
    selectOverlap:false,
};

【问题讨论】：

标签： fullcalendar ui-calendar fullcalendar-2

【解决方案1】：

您可以在 select 方法上执行此操作。只需从 startDate 到 endDate 并检查这些日子是否是周末。如果是，则显示警报/弹出窗口并返回 false。

select: (start, end, allDay) => {
    var startDate = moment(start),
    endDate = moment(end),
    date = startDate.clone(),
    isWeekend = false;

    while (date.isBefore(endDate)) {
        if (date.isoWeekday() == 6 || date.isoWeekday() == 7) {
            isWeekend = true;
        }    
        date.add(1, 'day');
    }

    if (isWeekend) {
        alert('can\'t add event - weekend');

        return false;
    }

    this.startDate= startDate.format("YYYY-MM-DD");
    this.endDate= endDate.format("YYYY-MM-DD");   

    //$('.first.modal').modal('show');
},

见fiddle。

【讨论】：