Laravel 7/6 Form Submit Validation Example Tutorial

In this tutorial you will learn about the Laravel 7/6 Form Submit Validation Example Tutorial and its application with practical example.

In this Laravel 7/6 Form Submit Validation Tutorial I’ll show you how to submit form with validation in laravel 7 and 6. In this article I will also show you how to validate form data before submit in laravel. In this tutorial you will learn to submit form with validation in laravel.In this tutorial I will demonstrate you how to validate form data on the server-side before submit on controller and store data into database in laravel.

Table Of Contents−

Laravel 7/6 Form Submit Validation Example Tutorial

In this tutorial you will also learn to submit form data on the controller and validate using laravel validation rules.

In this step by step tutorial I will share example to submit form data with validation in laravel. Please follow the instruction given below:

Install Laravel Fresh Setup

Setup Database
Make Migration file with Model
Make Route

Create Controller & Methods
Create Blade View
Start Development Server

1). Install Laravel Fresh Setup

First of all we need to create a fresh laravel project, download and install Laravel using the below command

composer create-project --prefer-dist laravel/laravel Blog

1	composer create-project --prefer-dist laravel/laravel Blog

2). Setup Database

Now, lets create a MySQL database and connect it with laravel application. After creating database we need to set database credential in application’s .env file.

DB_CONNECTION=mysql 
 DB_HOST=127.0.0.1 
 DB_PORT=3306 
 DB_DATABASE=here your database name here
 DB_USERNAME=here database username here
 DB_PASSWORD=here database password here

DB_CONNECTION=mysql

DB_HOST=127.0.0.1

DB_PORT=3306

DB_DATABASE=here your database name here

DB_USERNAME=here database username here

DB_PASSWORD=here database password here

3). Make Migration file with Model

Now, in this step we will create model and migration file. Please run the following command:

 php artisan make:model Contact -m

1	php artisan make:model Contact -m

Now go to Go to /database/migrations and open create_contacts_table.php file. Then add the below function into create_contacts_table.php file :

bigIncrements('id');$table-&gt;string('name');$table-&gt;string('email');$table-&gt;text('message');$table-&gt;timestamps();});}publicfunctionup(){Schema::create('contacts',function(Blueprint$table){$table-&gt;bigIncrements('id');$table-&gt;string('name');$table-&gt;string('email');$table-&gt;text('message');$table-&gt;timestamps();});} decode:true " &gt;public function up()
 {
     Schema::create('contacts', function (Blueprint $table) {
         $table-&gt;bigIncrements('id');
         $table-&gt;string('name');
         $table-&gt;string('email');
         $table-&gt;text('message');
         $table-&gt;timestamps();
     });
 }

bigIncrements('id');$table->string('name');$table->string('email');$table->text('message');$table->timestamps();});}publicfunctionup(){Schema::create('contacts',function(Blueprint$table){$table->bigIncrements('id');$table->string('name');$table->string('email');$table->text('message');$table->timestamps();});} decode:true " >public function up()

{

Schema::create('contacts', function (Blueprint $table) {

$table->bigIncrements('id');

$table->string('name');

$table->string('email');

$table->text('message');

$table->timestamps();

});

}

Before we run php artisan migrate command go to app/providers/AppServiceProvider.php and put the below code :

..
use Illuminate\Support\Facades\Schema;
  
....
function boot()
{
    Schema::defaultStringLength(191);
}
...

use Illuminate\Support\Facades\Schema;

....

function boot()

{

Schema::defaultStringLength(191);

}

...

Now, in this step we will create model and migration file. Please run the following command:

php artisan migrate

1	php artisan migrate

Now go to app/Contact.php file and add the fillable properties like this :

protected $fillable = ['name', 'email', 'message'];

1	protected $fillable = ['name', 'email', 'message'];

4). Make Route

After this, we need to define routes in “routes/web.php” file. Lets open “routes/web.php” file and add the following routes in it.

routes/web.php

 Route::get('form', 'ContactController@index');
 Route::post('form-store', 'ContactController@store');

1 2	Route::get('form', 'ContactController@index'); Route::post('form-store', 'ContactController@store');

5). Create Controller

Now, lets create a controller named ContactController using command given below –

php artisan make:controller ContactController

1	php artisan make:controller ContactController

After successfully create controller go to app/controllers/http//ContactController.php and put the below code :

<?php
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
use Validator,Redirect,Response;
use App\Contact;
 
class ContactController extends Controller
{
 
    public function index()
    {
      return view('contact');
    }
 
    public function store(Request $request)
    {
        $data = request()->validate([
        'name' => 'required',
        'email' => 'required|email',
        'message' => 'required'
        ]);
        
        $check = Contact::create($data);
 
        return Redirect::to("form")->withSuccess('Great! Form successfully submit with validation.');
    }
}

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use Validator,Redirect,Response;

use App\Contact;

class ContactController extends Controller

{

public function index()

{

return view('contact');

}

public function store(Request $request)

{

$data = request()->validate([

'name' => 'required',

'email' => 'required|email',

'message' => 'required'

]);

$check = Contact::create($data);

return Redirect::to("form")->withSuccess('Great! Form successfully submit with validation.');

}

6). Create Blade view

Now, we will create a blade view file name contact.blade.php and put the following code in it:

<html>
<head>
<title>Laravel Form Validation From Scratch</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<style type="text/css">
body{
background-color: #25274d;
}
.contact{
padding: 4%;
height: 400px;
}
.col-md-3{
background: #ff9b00;
padding: 4%;
border-top-left-radius: 0.5rem;
border-bottom-left-radius: 0.5rem;
}
.contact-info{
margin-top:10%;
}
.contact-info img{
margin-bottom: 15%;
}
.contact-info h2{
margin-bottom: 10%;
}
.col-md-9{
background: #fff;
padding: 3%;
border-top-right-radius: 0.5rem;
border-bottom-right-radius: 0.5rem;
}
.contact-form label{
font-weight:600;
}
.contact-form button{
background: #25274d;
color: #fff;
font-weight: 600;
width: 25%;
}
.contact-form button:focus{
box-shadow:none;
}
</style>
<body>
<div class="container contact">
<br><br><br>
<div class="row">
<div class="col-md-3">
<div class="contact-info">
<img src="{{ url('public/images/1553741491contact-image.png') }}" alt="image"/>
<h2>Contact Us</h2>
<h4>We would love to hear from you !</h4>
</div>
</div>
<div class="col-md-9">
@if ($message = Session::get('success'))
<div class="alert alert-success alert-block">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>{{ $message }}</strong>
</div>
<br>
@endif
<form action="{{ url('form-store') }}" method="post" accept-charset="utf-8">
@csrf
<div class="contact-form">
<div class="form-group">
<label class="control-label col-sm-2" for="fname">First Name:</label>
<div class="col-sm-10">          
<input type="text" class="form-control" id="name" placeholder="Enter Name" name="name">
<span class="text-danger">{{ $errors->first('name') }}</span>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="email">Email:</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" placeholder="Enter email" name="email">
<span class="text-danger">{{ $errors->first('email') }}</span>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="comment">Comment:</label>
<div class="col-sm-10">
<textarea class="form-control" rows="5" name="message" id="message"></textarea>
<span class="text-danger">{{ $errors->first('message') }}</span>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</div>
</div>
</form>
</div>
</div>
<br><br><br><br>
</div>
</body>
</html>

100

101

102

103

104

105

106

107

108

<html>

<head>

<title>Laravel Form Validation From Scratch</title>

</head>

body{

background-color: #25274d;

}

.contact{

padding: 4%;

height: 400px;

}

.col-md-3{

background: #ff9b00;

padding: 4%;

border-top-left-radius: 0.5rem;

border-bottom-left-radius: 0.5rem;

}

.contact-info{

margin-top:10%;

}

.contact-info img{

margin-bottom: 15%;

}

.contact-info h2{

margin-bottom: 10%;

}

.col-md-9{

background: #fff;

padding: 3%;

border-top-right-radius: 0.5rem;

border-bottom-right-radius: 0.5rem;

}

.contact-form label{

font-weight:600;

}

.contact-form button{

background: #25274d;

color: #fff;

font-weight: 600;

width: 25%;

}

.contact-form button:focus{

box-shadow:none;

}

</style>

<body>

<h2>Contact Us</h2>

<h4>We would love to hear from you !</h4>

</div>

@if ($message = Session::get('success'))

<strong>{{ $message }}</strong>

</div>

<br>

@endif

@csrf

<label class="control-label col-sm-2" for="fname">First Name:</label>

<span class="text-danger">{{ $errors->first('name') }}</span>

</div>

<label class="control-label col-sm-2" for="email">Email:</label>

<span class="text-danger">{{ $errors->first('email') }}</span>

</div>

<label class="control-label col-sm-2" for="comment">Comment:</label>

<span class="text-danger">{{ $errors->first('message') }}</span>

</div>

<button type="submit" class="btn btn-default">Submit</button>

</div>

</form>

</div>

</div>

</body>

</html>

7). Run Development Server

Now we are ready to run our example so lets start the development server using following artisan command –

php artisan serve

1	php artisan serve

Now, open the following URL in browser to see the output –

 http://localhost:8000/form

1	http://localhost:8000/form

AngularJS

CodeIgniter

Laravel

Node Js

Wordpress

More Blog

Learn

ABOUT PAGES

Laravel 7/6 Form Submit Validation Example Tutorial