Hello World, Welcome to my website. Today i am going to discuss about ajax and laravel. In this tutorial, we will learn how to fetch data from database with ajax in laravel. In this tutorial, we will extend the previous tutorial, how to work with ajax in laravel. In the previous article, we have implemented ajax on static data. In this, we will fetch data from database.

I have divided this tutorial in followings steps:

• Database Connectivity
• Create Modal and Migrations
• Add Dummy Data in database
• PostController Setting
• Run the project

Database Connectivity

We are dealing with database so it is very important to understand the database connectivity in Laravel. I am using xampp so i will go according to that.

• Create a database in phpmyadmin
• Open /.env file and add database credentials in it.

---

Create Modal and Migrations

• Modal is responsible for fetching data from database. All modal placed in /app folder.
• Migrations is responsible for creating table with columns in database. All migrations are placed in /database/migrations/ folder.

In Laravel, You can create modal with migration with single command. Run the following command to create Modal with migrations.

>> php artisan make:modal Post -m

In the above command -m flag represent the migration command. Open newly created migration file and add the following code in up method.

Schema::create('posts', function (Blueprint $table) {
            $table->increments('id');
            $table->string('title');
            $table->text('body');
            $table->timestamps();
        });

• Run the following command to run the migration file.

>>  php artisan migrate

• Check your database, you will see the posts table with defined columns.

If you face any string length error then please add the following code in the /app/Providers/AppServiceProvider.php

// Add Above the AppServiceProvider class
use Illuminate\Support\Facades\Schema;

// Add in the boot method
Schema::defaultStringLength(191);

---

Add Dummy Data in database

In this step, we will add some dummy data in database with laravel factory class.

• Open /database/factories/UserFactory.php file and add the following code at the end of this file.

$factory->define(App\Post::class, function (Faker $faker) {
    return [
        'title' => $faker->name,
        'body' => $faker->text,
    ];
});

In the above code  will help to add the title and body data in posts table.

• Open command line and add the command in it.

>>  php artisan tinker

>>  factory(App\Post::class,10)->create();

Above commands will add 10 rows in posts table

---

PostController Setting

In this section we will apply small change. We just fetch data from database with our Post modal. As you know we have defined static data in the previous article. Apply the following changes in app/Http/Controllers/PostController.php file.

// Add the following code just above the class
use App\Post;

// Replace the following code with the previous static data code
$data=Post::all();

---

Run the project

Open browser and run the project. You will see the post articles result But this time these are coming from database. 🙂 🙂

---

I Hope you have enjoyed this tutorials. Please add your feedback the comment section.