Web Prepration

Web Concept Tutorials

Laravel, PHP
21 December 2017
5 Comments

In this post, I am going to explain how to create CURD (Create,Update,Read and Delete) operation with image in laravel 5+ from scratch. This post is very helpful for laravel beginners. In this CRUD application just need to follow all steps. I used resource route, validation, listing etc in this crud application example.

After finish all step successfully, you will find output like as bellow image output.

Laravel Curd

Step 1: Laravel Installation

If you haven’t installed laravel in your system and want to fresh project then just run bellow command and get new Laravel project.

1
2
3
 
composer create-project --prefer-dist laravel/laravel laravelcurd
 




After clone laravel application, we also require to install laravelcollective/html for Form class,you can install laravelcollective/html class using composer just need to update composer.json file and add “laravelcollective/html”: “~5.0” in require section.

after that changes run below command.

1
2
3
 
composer update
 

Step 2: Create items table and model

In this step we have to create migration for items table using Laravel  php artisan command, so first fire bellow command:

1
2
3
 
php artisan make:migration create_items_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 items table

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
<?php
 
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
 
class CreateItemsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('items', function (Blueprint $table) {
           $table->increments('id');
           $table->string('brand_name');
           $table->string('model_name');
           $table->string('price');
           $table->string('description');
           $table->string('image')->nullable();
           $table->timestamps();
        });
    }
 
    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('items');
    }
}
 

After create “items” table you should create Item model for items, so first create file in this path app/Item.php and put bellow content in item.php file:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<?php
namespace App;
 
 
use Illuminate\Database\Eloquent\Model;
 
 
class Item extends Model
{
 
 
     protected $fillable = ['brand_name','model_name','price','description','image'];
 
 
}
?>
 

Step 3: Configure database and migrate tables

Now we just need to create new database in phpmyadmin with any name  and then just change database configuration setting in .env file. There are three things are need to change like DB_DATABASE,DB_USERNAME and DB_PASSWORD. Then run below command.

1
2
3
 
php artisan migrate
 

Step 4: Add Route

Now we have to add route for items CRUD, in this example i added resource route for application, if we add resource route then it will add index, create, show, edit and delete route automatically. So add bellow line in your route file.

1
2
3
 
Route::resource('itemCRUD','ItemCRUDController');
 

Step 5: Create Controller

Now we should create new controller as ItemCRUDController in this path app/Http/Controllers/ItemCRUDController.php. this controller will manage all route method, So add bellow line in your ItemCRUDController.php  file.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
 
<?php
namespace App\Http\Controllers;
 
 
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
use App\Item;
 
 
class ItemCRUDController extends Controller
{
 
 
    public function index(Request $request)
    {
        $items = Item::orderBy('id','DESC')->paginate(5);
        return view('ItemCRUD.index',compact('items'))
            ->with('i', ($request->input('page', 1) - 1) * 5);
    }
 
    public function create()
    {
        return view('ItemCRUD.create');
    }
 
 
    public function store(Request $request)
    {
      $this->validate($request, [
            'brand_name' => 'required',
            'model_name' => 'required',
            'price' => 'required|numeric',
        ]);
        $image = $request->file('image');        
        $fileName = $image->getClientOriginalName();
        $fileExtension = $image->getClientOriginalExtension();
        // $imageName = date('dmY').'.'.$request->file('image')->getClientOriginalExtension();
        $request->file('image')->move(
        base_path() . '/public/images/', $fileName);
        $requestData = $request->all();
        $requestData['image'] = $fileName;
        Item::create($requestData);
        return redirect()->route('itemCRUD.index')
                        ->with('success','Record created successfully');
    }
 
    public function show($id)
    {
        $item = Item::find($id);
        return view('ItemCRUD.show',compact('item'));
    }
 
    public function edit($id)
    {
        $item = Item::find($id);
        return view('ItemCRUD.edit',compact('item'));
    }
 
    public function update(Request $request, $id)
    {
         $this->validate($request, [
            'brand_name' => 'required',
            'model_name' => 'required',
            'price' => 'required',
        ]);
        $image = $request->file('image');        
        $fileName = $image->getClientOriginalName();
        $fileExtension = $image->getClientOriginalExtension();
        // $imageName = date('dmY').'.'.$request->file('image')->getClientOriginalExtension();
        $request->file('image')->move(
        base_path() . '/public/images/', $fileName);
        $requestData = $request->all();
        $requestData['image'] = $fileName;
        Item::find($id)->update($requestData);
        return redirect()->route('itemCRUD.index')
                        ->with('success','Record updated successfully');
    }
    public function destroy($id)
    {
        Item::find($id)->delete();
        return redirect()->route('itemCRUD.index')
                        ->with('success','Record deleted successfully');
    }
}
?>
 

Step 6: Create Blade File

In this step we will create blade file for listing, create, edit and show records and also create default blade file for theme layout setting. So first we create new layouts directory and create default.blade.php file inside that folder

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
 
 
    <title>Webprepration</title>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.css" rel="stylesheet">
 
 
</head>
<body>
 
<div class="container">
    @yield('content')
</div>
 
</body>
</html>
 

Now we will create layout for records listing, So first we create new ItemCRUD directory and create index.blade.php file inside that folder.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
 
@extends('layouts.default')
 
@section('content')
 
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2>Record List</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-success" href="{{ route('itemCRUD.create') }}">Add</a>
            </div>
        </div>
    </div>
    @if ($message = Session::get('success'))
        <div class="alert alert-success">
            <p>{{ $message }}</p>
        </div>
    @endif
    <table class="table table-bordered">
        <tr>
            <th>No</th>
            <th>Brand Name</th>
            <th>Model Name</th>
            <th>Price</th>
            <th>Image</th>
            <th width="280px">Action</th>
        </tr>
    @foreach ($items as $key => $item)
    <tr>
        <td>{{ ++$i }}</td>
        <td>{{ $item->brand_name }}</td>
        <td>{{ $item->model_name }}</td>
        <td>{{ $item->price }}</td>
        <td><img id="blah" src="{{URL::to('/')}}/images/{{$item->image}}" width="50"/></td>
        <td>
            <a class="btn btn-info" href="{{ route('itemCRUD.show',$item->id) }}">Show</a>
            <a class="btn btn-primary" href="{{ route('itemCRUD.edit',$item->id) }}">Edit</a>
            {!! Form::open(['method' => 'DELETE','route' => ['itemCRUD.destroy', $item->id],'style'=>'display:inline']) !!}
            {!! Form::submit('Delete', ['class' => 'btn btn-danger']) !!}
            {!! Form::close() !!}
        </td>
    </tr>
    @endforeach
    </table>
    {!! $items->render() !!}
 
@endsection
 

Now we create new blade file for create new record, it’s call create.blade.php file inside “ItemCRUD” directory

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
 
@extends('layouts.default')
 
@section('content')
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2>Add New Record</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-primary" href="{{ route('itemCRUD.index') }}"> Back</a>
            </div>
        </div>
    </div>
    @if (count($errors) > 0)
        <div class="alert alert-danger">
            <strong>Whoops!</strong> There were some problems with your input.<br><br>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    {!! Form::open(array('route' => 'itemCRUD.store','files'=>true,'method'=>'POST')) !!}
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Brand Name:</strong>
                {!! Form::text('brand_name', null, array('placeholder' => 'Brand Name','class' => 'form-control')) !!}
            </div>
        </div>
 
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Model Name:</strong>
                {!! Form::text('model_name', null, array('placeholder' => 'Model Name','class' => 'form-control')) !!}
            </div>
        </div>
 
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Price:</strong>
                {!! Form::text('price', null, array('placeholder' => 'Price','class' => 'form-control')) !!}
            </div>
        </div>
 
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Description:</strong>
                 {!! Form::textarea('description', null, array('placeholder' => 'Description','class' => 'form-control','style'=>'height:100px')) !!}                
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Image:</strong>
               {!! Form::file('image',array('placeholder' => 'Image','class' => 'form-control','onchange' => 'document.getElementById("blah").src = window.URL.createObjectURL(this.files[0])')) !!}
            </div>
            <img id="blah" src="#" alt="your image" width="150"/>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12 text-center">
                <button type="submit" class="btn btn-primary">Submit</button>
        </div>
    </div>
    {!! Form::close() !!}
@endsection
 

Next, we have to create show.blade.php file for record details page in same directory.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
 
@extends('layouts.default')
 
@section('content')
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2> Show Record</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-primary" href="{{ route('itemCRUD.index') }}"> Back</a>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Brand Name:</strong>
                {{ $item->brand_name }}
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Model Name:</strong>
                {{ $item->model_name }}
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Price:</strong>
                {{ $item->price }}
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Description:</strong>
                {{ $item->description }}
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Image:</strong>
                <img id="blah" src="{{URL::to('/')}}/images/{{$item->image}}" alt="your image" width="150"/>
            </div>
        </div>
 
 
    </div>
 
 
@endsection
 

At last, we need to create edit.blade.php file for update record in same.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
 
@extends('layouts.default')
 
@section('content')
 
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2>Edit Record</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-primary" href="{{ route('itemCRUD.index') }}"> Back</a>
            </div>
        </div>
    </div>
 
    @if (count($errors) > 0)
        <div class="alert alert-danger">
            <strong>Whoops!</strong> There were some problems with your input.<br><br>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    {!! Form::model($item, ['method' => 'PATCH','route' => ['itemCRUD.update', $item->id],'files'=>true]) !!}
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Brand Name:</strong>
                {!! Form::text('brand_name', null, array('placeholder' => 'Brand Name','class' => 'form-control')) !!}
            </div>
        </div>
 
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Model Name:</strong>
                {!! Form::text('model_name', null, array('placeholder' => 'Model Name','class' => 'form-control')) !!}
            </div>
        </div>
 
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Price:</strong>
                {!! Form::text('price', null, array('placeholder' => 'Price','class' => 'form-control')) !!}
            </div>
        </div>
 
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Description:</strong>
                 {!! Form::textarea('description', null, array('placeholder' => 'Description','class' => 'form-control','style'=>'height:100px')) !!}                
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Image:</strong>
               {!! Form::file('image',array('placeholder' => 'Image','class' => 'form-control','onchange' => 'document.getElementById("blah").src = window.URL.createObjectURL(this.files[0])')) !!}
            </div>
            <img id="blah" src="{{URL::to('/')}}/images/{{$item->image}}" alt="your image" width="150"/>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12 text-center">
                <button type="submit" class="btn btn-primary">Submit</button>
        </div>
    </div>
    {!! Form::close() !!}
@endsection
 

View Demo

Now everything is completed of laravel CURD application if you want to download of demo then click here. For other laravel  tutorials or queries you can follow my blog laravel category.

Thanks!!!!

, , , , ,

5 comments on Create CURD operation in Laravel

  • furtdsolinopv
    Reply
    Thursday, 22 February, 2018 07:15 AM

    Wonderful work! That is the type of info that are meant to be shared around the web. Disgrace on the search engines for no longer positioning this publish upper! Come on over and consult with my site . Thank you =)

  • zvodretiluret
    Reply
    Tuesday, 10 April, 2018 02:33 AM

    Hiya, I am really glad I’ve found this information. Today bloggers publish only about gossips and net and this is actually frustrating. A good web site with interesting content, that is what I need. Thank you for keeping this website, I will be visiting it. Do you do newsletters? Cant find it.

Write a comment

Your email address will not be published.

Recent Posts

Categories

© Copyright 2019-2022 By Webprepration.com | Web Development Tutorials & Demos. All Right Reserved.