How to integrate jQuery Fullcalendar using Codeigniter and MySQL

Today, I would like to share with you integration of jQuery full calendar events using Codeigniter and MySQL.

Fullcalendar is jquery library that provide us to display calendar with events and more. Fullcalendar js provide year, month, week and day calendar for displaying. If you are working on event management, task management or any thing that related date to date, at that time if you use event calendar like fullcalendar then it’s better.

you can use https://www.cdnpkg.com/fullcalendar or Download Fullcalendar jQuery Library

Controller to view call

public function Calendar()
{
	$data['getEmployee'] = $this->EmployeeModel->getEmployee();	
	$data['getHoliday'] = $this->EmployeeModel->getHoliday();
	$data['getAttendance'] = $this->EmployeeModel->getAttendance();
	$data['getSalary'] = $this->EmployeeModel->getSalary();
	$data['getShift'] = $this->EmployeeModel->getShift();
	$data['getShiftAttendance'] = $this->EmployeeModel->getShiftAttendance();
	$this->load->view('calendar',$data);
}

Fullcalendar is jquery library in Header

<link href='<?=base_url()?>calendardata/fullcalendar.min.css' rel='stylesheet' />
<link href='<?=base_url()?>calendardata/fullcalendar.print.min.css' rel='stylesheet' media='print' />
<script src='<?=base_url()?>calendardata/lib/moment.min.js'></script>
<script src='<?=base_url()?>calendardata/lib/jquery.min.js'></script>
<script src='<?=base_url()?>calendardata/fullcalendar.min.js'></script>
<script src='<?=base_url()?>calendardata/gcal.min.js'></script>

HTML Code

<div class="row">
	<div class="col-md-12">
		<div id="alert_holder"></div>
		<div class="calendar">                                
			<div id="calendarappointment"></div>                            
		</div>
	</div>
</div>

Jquery Code

<script>
	$('#calendar').fullCalendar({
		displayEventTime: false,

		header: {
			left: 'prev,next today',
			center: 'title',
			right: 'month,agendaWeek,agendaDay'
		},
		buttonText: {
			prev: "",
			next: "",
			today: 'Today',
			month: 'Month',
			week: 'Week',
			day: 'Day'
		},
		events: [

			<?php
				foreach ($getHoliday as $holiday)
				{ 
					$start_day = date('d', strtotime($holiday->holDate));
					$smonth = date('n', strtotime($holiday->holDate));
					$start_month = $smonth - 1;
					$start_year = date('Y', strtotime($holiday->holDate));
					$end_year = date('Y', strtotime($holiday->holDate));
					$end_day = date('d', strtotime($holiday->holDate));
					$emonth = date('n', strtotime($holiday->holDate));
					$end_month = $emonth - 1;
					?>
					{
						title: "Holiday: <?=$holiday->holName?>",
						start: new Date(<?php echo $start_year . ',' . $start_month . ',' . $start_day; ?>),
						end: new Date(<?php echo $end_year . ',' . $end_month . ',' . $end_day; ?>),
						color: '#8A2BE2',
						url: '<?= base_url()?>view-attendance?date=<?= $holiday->holDate ?>',
					},

			<?php	}
			?>

			<?php
				foreach ($getAttendance as $attendance)
				{ 
					$start_day = date('d', strtotime($attendance->attDate));
					$smonth = date('n', strtotime($attendance->attDate));
					$start_month = $smonth - 1;
					$start_year = date('Y', strtotime($attendance->attDate));
					$end_year = date('Y', strtotime($attendance->attDate));
					$end_day = date('d', strtotime($attendance->attDate));
					$emonth = date('n', strtotime($attendance->attDate));
					$end_month = $emonth - 1;
					?>
					{
						title: "Attendence: <?=$attendance->empFirstName?>",
						start: new Date(<?php echo $start_year . ',' . $start_month . ',' . $start_day; ?>),
						end: new Date(<?php echo $end_year . ',' . $end_month . ',' . $end_day; ?>),
						color: 'green',
						url: '<?= base_url()?>view-attendance?date=<?= $attendance->attDate ?>',
					},

			<?php	}
			?>

			<?php
				foreach ($getShift as $shift)
				{ 
					$start_day = date('d', strtotime($shift->aloDay));
					$smonth = date('n', strtotime($shift->aloDay));
					$start_month = $smonth - 1;
					$start_year = date('Y', strtotime($shift->aloDay));
					$end_year = date('Y', strtotime($shift->aloDay));
					$end_day = date('d', strtotime($shift->aloDay));
					$emonth = date('n', strtotime($shift->aloDay));
					$end_month = $emonth - 1;
					?>
					{
						title: "Shift Allocation: <?=$shift->empFirstName?>",
						start: new Date(<?php echo $start_year . ',' . $start_month . ',' . $start_day; ?>),
						end: new Date(<?php echo $end_year . ',' . $end_month . ',' . $end_day; ?>),
						color: 'red',
						url: '<?= base_url()?>view-shift?date=<?= $shift->aloDay ?>',
					},

			<?php	}
			?>
			<?php
				foreach ($getShiftAttendance as $shiftatte)
				{ 
					$start_day = date('d', strtotime($shiftatte->aloDay));
					$smonth = date('n', strtotime($shiftatte->aloDay));
					$start_month = $smonth - 1;

					$start_year = date('Y', strtotime($shiftatte->aloDay));

					$end_year = date('Y', strtotime($shiftatte->aloDay));
					$end_day = date('d', strtotime($shiftatte->aloDay));

					$emonth = date('n', strtotime($shiftatte->aloDay));
					$end_month = $emonth - 1;
					?>
					{
						title: "Shift Attendance: <?=$shiftatte->empFirstName?>",
						start: new Date(<?php echo $start_year . ',' . $start_month . ',' . $start_day; ?>),
						end: new Date(<?php echo $end_year . ',' . $end_month . ',' . $end_day; ?>),
						color: '#D2691E',
						url: '<?= base_url()?>shift-view-attendance?date=<?= $shiftatte->aloDay ?>',
					},

			<?php	}
			?>

		],
		eventColor: '#3A87AD',
	});
</script>

Leave a Reply

Your email address will not be published. Required fields are marked *