jquery fullCalendar - 从数据库获取日期类型,并在压缩加载时获取颜色特定日期

时间:2015-07-18 07:17:41

标签: jquery fullcalendar

我正在使用最新版本的jQuery完整日历。我想在最初加载日历时(而不是在加载事件时)使用单独的颜色在我的日历中为特定日期着色。我将日期与颜色代码保存在一个单独的MySQL数据库表中。

以下是界面应如下所示的示例:

https://drive.google.com/open?id=0B4YRdfCv-ciIQ0w2djVFMXB0ODg

我现在被卡住了。这是我到目前为止所做的:

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month'//'month,agendaWeek,agendaDay'
    },
    fixedWeekCount:false,
    businessHours: false,
    editable: false,
    droppable: true, // this allows things to be dropped onto the calendar
    loading: function (bool) {
        if (bool) {
            $('#loading').show();
        } else {
            $('#loading').hide();
        }
    }
    events: {
        url: '/leave/load_events',
        data: function () { // a function that returns an object
            return {
                employee_id: $('#employee_id').val()
            };
        }
    },
    eventClick: function (event, jsEvent, view) {
        showPopup();
    },
    eventRender: function (event, element, view) {
        element.find('.fc-title').append(event.description);

    }
});

1 个答案:

答案 0 :(得分:0)

我不太明白你想要做什么,但这里有一些着色日的例子:JSFiddle

$("#calendar").fullCalendar({
    dayRender:function(date, cell){ //change day cell to red every time the day cells are rendered
        cell.css("background-color","red");
    },
    dayClick:function(){ //change days to white when you click on them
        console.log(this);
        $(this).css("background-color","white");
    },
});
$("body > button").on("click",function(){ //when the green or yellow button is pushed, change a specific date's color.
    $(".fc-bg .fc-day").filter(function(index,day){
        if($(day).data("date")==="2015-08-02")
            return true;
        else
            return false;
    }).css("background-color",$(this).data("color"));
})

如果我错过了什么,请告诉我。