By Hardik Savani March 26, 2022 Category : LaravelPauseUnmuteLoaded: 1.11%FullscreenHi,
This post will give you example of laravel 9 fullcalendar example. we will help you to give example of laravel 9 fullcalendar crud example. In this article, we will implement a laravel 9 fullcalendar ajax. you can understand a concept of laravel 9 fullcalendar event click.
In this example, we will simply create a crud application with full calendar so you can easily create events, edit events by drag and drop and delete event. in this example, we will create an events table with a start, edit date, and title column. then you can add, edit and delete that event with the database.
Let's follow few step to make it laravel fullcalender crud app:
Step 1: Install Laravel 9
This is optional; however, if you have not created the laravel app, then you may go ahead and execute the below command:
In this step we have to create migration for events table using Laravel 9 php artisan command, so first fire bellow command:
php artisan make:migration create_events_table
After this command you will find one file in following path "database/migrations" and you have to put bellow code in your migration file for create events table.
<?php use Illuminate\Database\Migrations\Migration;use Illuminate\Database\Schema\Blueprint;use Illuminate\Support\Facades\Schema; return new class extends Migration{ /** * Run the migrations. * * @return void */ public function up() { Schema::create('events', function (Blueprint $table) { $table->id(); $table->string('title'); $table->date('start'); $table->date('end'); $table->timestamps(); }); } /** * Reverse the migrations. * * @return void */ public function down() { Schema::dropIfExists('events'); }};
Then after, simply run migration:
php artisan migrate
After create "events" table you should create Event model for items, so first create file in this path "app/Models/Event.php" and put bellow content in Event.php file:
app/Models/Event.php
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory;use Illuminate\Database\Eloquent\Model; class Event extends Model{ use HasFactory; /** * The attributes that are mass assignable. * * @var array */ protected $fillable = [ 'title', 'start', 'end' ];}
After this command you can find FullCalenderController.php file in your app/Http/Controllers directory. open FullCalenderController.php file and put bellow code in that file.
In this step we will add routes and controller file so first add bellow route in your routes.php file.
routes/web.php
<?php use Illuminate\Support\Facades\Route; use App\Http\Controllers\FullCalenderController; /*|--------------------------------------------------------------------------| Web Routes|--------------------------------------------------------------------------|| Here is where you can register web routes for your application. These| routes are loaded by the RouteServiceProvider within a group which| contains the "web" middleware group. Now create something great!|*/ Route::controller(FullCalenderController::class)->group(function(){ Route::get('fullcalender', 'index'); Route::post('fullcalenderAjax', 'ajax');});
Step 5: Create Blade File
Ok, in this last step we will create fullcalender.blade.php file for display fullcalender and we will write js code for crud app. So first create fullcalender.blade.php file and put bellow code:
PauseUnmuteLoaded: 1.11%Fullscreen
Hi,
