Friday, July 19, 2024
LaravelLaravel 8Laravel 9

Laravel – Fullcalendar with Dynamic Data Working Example

Laravel – Fullcalendar with Dynamic Data Working Example

Hello to all, welcome to In this post, I will tell you, Laravel – Fullcalendar with Dynamic Data Working Example.

In this post, I will get events data from Laravel controller and show events to Laravel blade template.

Guys this will also work with Laravel 8 and Laravel 9.

Laravel – Fullcalendar with Dynamic Data Working Example

Here is the working code snippets, you need to follow:

1. Very First, we need to add to code in laravel HomeController.php file:

In this, I made custom events with php array for fullcalendar:

public function Chartjs(){
        $Events = array
                    "0" => array
                               "title" => "Event One",
                               "start" => "2018-10-31",
                    "1" => array
                                "title" => "Event Two",
                                "start" => "2018-11-01",
        return view('fullcalendar',['Events' => $Events]);

2. Here is the code, you need to add laravel routes/web.php file:

Route::get("/fullcalendar", "HomeController@Chartjs");

3. Finally, here is the code for laravel blade template file fullcalendar.blade.php:

I made laravel controller array data into json format for fullcalendar events data:

<!DOCTYPE html>
<meta charset='utf-8' />
<link href='' rel='stylesheet' />
<link href='' rel='stylesheet' media='print' />
<link rel="stylesheet" href="">
<script src=''></script>
<script src=''></script>
<script src=''></script>

  $(document).ready(function() {
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,basicWeek,basicDay'
      navLinks: true, // can click day/week names to navigate views
      editable: true,
      eventLimit: true, // allow "more" link when too many events

           events: <?php echo json_encode($Events); ?>



  <div id='calendar'></div>


In the end run the laravel project:


This is the code and if you have any query related to this post, then do comment below or ask question.

Thank you,

Jatt Da Muqabla,


the authortherichpost
Hello to all. Welcome to Myself Ajay Malhotra and I am freelance full stack developer. I love coding. I know WordPress, Core php, Angularjs, Angular 14, Angular 15, Angular 16, Angular 17, Bootstrap 5, Nodejs, Laravel, Codeigniter, Shopify, Squarespace, jQuery, Google Map Api, Vuejs, Reactjs, Big commerce etc.


Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.