Cannot get FullCalendar to work (Laravel 5)

8.1k views Asked by At

I'm quite new at Laravel 5 and I've been trying to follow the instructions on Github to install the full calendar (stated on: https://github.com/maddhatter/laravel-fullcalendar)

Currently I simply want to display the calendar on my site, so I did the following:

Installed the plugin through composer with: 'composer require maddhatter/laravel-fullcalendar' & added an alias to my app.php.

Next I made a interface that extends Eloquent\Model like this: (For when I add Events to my database):

<?php namespace App;

use Illuminate\Database\Eloquent\Model;

class EventModel extends Model \MaddHatter\LaravelFullcalendar\IdentifiableEvent{

    //fillable = Being able to mass assign (MassAssignment exception)

    protected $dates = ['start', 'end'];
    /**
     * Get the event's id number
     *
     * @return int
     */
    public function getId();

    /**
     * Get the event's title
     *
     * @return string
     */
    public function getTitle()
    {
        return $this->title;
    }

    /**
     * Is it an all day event?
     *
     * @return bool
     */
    public function isAllDay()
    {
        return (bool)$this->all_day;
    }

    /**
     * Get the start time
     *
     * @return DateTime
     */
    public function getStart()
    {
        return $this->start;
    }

    /**
     * Get the end time
     *
     * @return DateTime
     */
    public function getEnd()
    {
        return $this->end;
    }

}

Then in my controller I added:

<?php namespace App\Http\Controllers;

use App\Http\Requests;
use App\Http\Controllers\Controller;

use Illuminate\Http\Request;

class CalendarController extends Controller {

$events[] = \Calendar::event(
    'Event One', //event title
    false, //full day event?
    '2015-06-05T0800', //start time (you can also use Carbon instead of DateTime)
    '2015-06-05T0800', //end time (you can also use Carbon instead of DateTime)
    0 //optionally, you can specify an event ID
);

$eloquentEvent = EventModel::first(); //EventModel implements MaddHatter\LaravelFullcalendar\Event  

$calendar = \Calendar::addEvents($events) //add an array with addEvents
    ->addEvent($eloquentEvent, [ //set custom color fo this event
        'color' => '#800',
    ])->setOptions([ //set fullcalendar options
        'firstDay' => 1
    ])->setCallbacks([ //set fullcalendar callback options (will not be JSON encoded)
        'viewRender' => 'function() {alert("Callbacks!");}'
]); 

return view('pages.calendar', compact('calendar'));

}

After doing this, is says on the instructions that I have to add the following to my view (which is in my folder: resources/pages/calendar.blade.php):

@extends('masterpage')
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.2.7/fullcalendar.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.2.7/fullcalendar.min.css"/>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.2.7/fullcalendar.print.css"/>


@section('content')

<h1> Calendar </h1>
{!! $calendar->calendar() !!}
{!! $calendar->script() !!}
@stop

I also did '$bower install fullcalendar' in my project to add them.

Also, here is my folder structure, seeing I might have missed something: folder structure

After following all these steps, it says the calendar should display but I'm getting this error: Undefined variable: calendar

It's probably me just being stupid, but how do I fix this?

2

There are 2 answers

0
davejal On BEST ANSWER

Did you eventually get this to work?

I just had some problems implementing myself and thought I'd add my experiences in resolving this.

This worked for me using laravel 5.1 and mysql (mariadb) on fedora.

  1. Model looks like the following (copied from https://github.com/maddhatter/laravel-fullcalendar) with changes to the following line from

class EventModel extends Eloquent implements \MaddHatter\LaravelFullcalendar\Event

to

class EventModel extends Model implements \MaddHatter\LaravelFullcalendar\Event

  1. Added the following lines to the controller

use App\EventModel; use MaddHatter\LaravelFullcalendar\Event;

  1. For db events add this inside the controller
$event = EventModel::all();

foreach ($event as $eve) {
  $events[] = \Calendar::event(
  $eve->title, //event title
  $eve->allDay, //full day event?
  $eve->start, //start time (you can also use Carbon instead of DateTime)
  $eve->end, //end time (you can also use Carbon instead of DateTime)
  $eve->id //optionally, you can specify an event ID
  );
}
  1. If you work with blade templating I had to add the scripts to both my master and calendar pages (if removed from one it wouldn't show the calendar)

  2. Dirty easy routing

Route::resource('calendar','CalendarController');

I'm new to laravel so I know there could be easier ways or I didn't follow conventions, but this is how I got it to work so far, hope it helps.

5
MaddHatter On

It looks like the code in your controller isn't in a method:

class CalendarController extends Controller {

    public function index() { //code should be inside a method
        $events[] = \Calendar::event(
            'Event One', //event title
            false, //full day event?
            '2015-06-05T0800', //start time (you can also use Carbon instead of DateTime)
            '2015-06-05T0800', //end time (you can also use Carbon instead of DateTime)
            0 //optionally, you can specify an event ID
        );

        $eloquentEvent = EventModel::first(); //EventModel implements MaddHatter\LaravelFullcalendar\Event  

        $calendar = \Calendar::addEvents($events) //add an array with addEvents
            ->setOptions([ //set fullcalendar options
                'firstDay' => 1
            ])->setCallbacks([ //set fullcalendar callback options (will not be JSON encoded)
                'viewRender' => 'function() {alert("Callbacks!");}'
        ]); 

        return view('pages.calendar', compact('calendar'));
    }

}

Update:

Your EventModel's getId() method needs to have body as well (i.e.: it needs to have an opening/closing { and }, and do something):

/**
 * Get the event's id number
 *
 * @return int
 */
public function getId() {
    return $this->id;
}

The readme.md for the project was missing an example body.

Update 2:

class EventModel extends Model \MaddHatter\LaravelFullcalendar\IdentifiableEvent

should be

class EventModel extends Model implements \MaddHatter\LaravelFullcalendar\IdentifiableEvent