CODEWITHSUNDEEP
jqueryfullcalendarrendering
Deepak Keynes
Deepak Keynes

Reputation: 2329

Color not rendered fully while rendering in FullCalendar

I want to add background color for the whole day and not the event background alone. For the code that i have written now, i could see events alone as background My view code is as follows:

<script>
$(document).ready(function() {

$('#calendar').fullCalendar({ 

utc: true, 
header: { 
left: 'prev,next today EventButton', 
center: 'title', 
right: 'month,agendaWeek,agendaDay' 
},   

editable: false, 
droppable: true, 

eventSources: ["<?php echo base_url() ?>calendar/show_holidays"]

});
});
</script>
<style>
.event-full { 
color:black;
vertical-align: middle !important;
text-align: center; 
opacity: 1; 
}

</style>

Now, My controller code is as follows through MVC:

public function show_holidays()
    {

    $holidays=$this->calendar_m->show_holidays();
    foreach($holidays as &$val){
     $val['allDay'] = 'true'; 
     $val['Rendering'] = 'Background'; 
     $val['textColor'] = '#000';
     $val['title'] = 'Holiday today' 
     $val['backgroundColor'] = 'yellow'; 
            }
     echo json_encode($holidays);
}

Upvotes: 2

Views: 489

Answers (2)

Shanka SMS
Shanka SMS

Reputation: 654

Pass this parameters as json and check this should work for you.....

$event['id'] = $row->id;
$event['name'] = $row->name;
$event['date'] = $row->date;
$event['backgroundColor'] = '#1ab394';
$event['rendering'] = 'background';

Upvotes: 2

user6269864
user6269864

Reputation:

To change the background-color, do this, substituting 2016-05-11 for your actual date:

$(".fc-bg td[data-date=2016-05-11]").css("background-color", "#38ac8a");

You would need to do it inside fullCalendar's viewRender function, otherwise the change will be lost on switching views.

Upvotes: 0

Related Questions