Laravel Fullcalendar 5.5 - php

Question

i'm trying to implement Laravel FullCalendar with help of (https://github.com/maddhatter/laravel-fullcalendar)
My controller code -
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Calendar;
use App\Event;
class EventController extends Controller
{
public function index()
{
$events = [];
$data = Event::all();
if($data->count()) {
foreach ($data as $key => $value) {
$events[] = Calendar::event(
$value->title,
true,
new \DateTime($value->start_date),
new \DateTime($value->end_date.' +1 day'),
null,
// Add color and link on event
[
'color' => '#f05050',
'url' => 'pass here url and any route',
]
);
}
}
$calendar = Calendar::addEvents($events);
return view('fullcalender', compact('calendar'));
}
}
Blade File -
#extends('layouts.app')
#section('style')
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.2.7/fullcalendar.min.css"/>
#endsection
#section('content')
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Full Calendar Example</div>
<div class="panel-body">
{!! $calendar->calendar() !!}
</div>
</div>
</div>
</div>
</div>
#endsection
#section('script')
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.2.7/fullcalendar.min.js"></script>
{!! $calendar->script() !!}
#endsection
I m sharing calendar event creation code.
$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)
'eventClick' => 'function() {
showModal();
}'
]);
everything work fine, but i need to open pophover (custom html) on click of event. as i had implemented same thing with JS fullcalendar (https://codepen.io/IsmiKin/pen/WbOeGw).
Any suggestion is appreciated. Thanks in advance.

Answer 1

Just add eventRender to the setCallbacks() method. I assumed you are using bootstrap 4.
$calendar = Calendar::addEvents($e)->setCallbacks([
'themeSystem' => '"bootstrap4"',
'eventRender' => 'function(event, element) {
element.popover({
animation: true,
html: true,
content: $(element).html(),
trigger: "hover"
});
}'
]);