jquery fullCalendar - get day type from database and color specific date when calander load -
i using latest version of jquery full calendar. want color specific days in calendar using separate colors when calendar loading (not when event loading). keep dates color codes in separate mysql database table.
here example of interface should like:
https://drive.google.com/open?id=0b4yrdfcv-ciiq0w2djvfmxb0odg
i'm stuck. here's have far:
$('#calendar').fullcalendar({ header: { left: 'prev,next today', center: 'title', right: 'month'//'month,agendaweek,agendaday' }, fixedweekcount:false, businesshours: false, editable: false, droppable: true, // allows things dropped onto calendar loading: function (bool) { if (bool) { $('#loading').show(); } else { $('#loading').hide(); } } events: { url: '/leave/load_events', data: function () { // function returns 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); } });
i don't quite understand trying do, here examples of coloring days: jsfiddle
$("#calendar").fullcalendar({ dayrender:function(date, cell){ //change day cell red every time day cells rendered cell.css("background-color","red"); }, dayclick:function(){ //change days white when click on them console.log(this); $(this).css("background-color","white"); }, }); $("body > button").on("click",function(){ //when green or yellow button pushed, change 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")); })
let me know if missed something.
Comments
Post a Comment