Create & Validate Laravel 9 Contact Form with Send Email

How to Create, Validate a Contact form in Laravel and send an email to admin on successful form submission. Also, store the contact form values in the database.

As soon as they land on the contact page, they see a basic form with the following values: name, email, phone number, subject, & message and fill it and send it across.

It enhances the user experience and gets you a business lead, helps solve user queries, or gives you feedback about your product or site.

In this tutorial, you will learn how to create a new laravel app, contact form UI using Bootstrap CSS framework, validating a contact form, sending email to the admin with contact form values using mailtrap app, integrating a mail in a controller class further creating mail view. All these will be covered under one roof.

Laravel Contact Form Example

Here are the step-by-step procedures that will help you create a user-friendly contact form in the Laravel project.

Install Laravel 9 App

The first step begins with creating a new Laravel application, FYI this tutorial focuses on version 9 nonetheless you can use it for previous and future versions:

composer create-project laravel/laravel --prefer-dist laravel-contact-us-example

Adding Database Details in ENV

Once the project has been arranged, on the other hand head over to .env file by the same token add your database name, user name and password:

DB_CONNECTION=mysql
DB_HOST=localhost
DB_PORT=3306
DB_DATABASE=db
DB_USERNAME=root
DB_PASSWORD=

Organize Model and Migrations

Now that you have to generate a database table pour some column values for invoking contact us form:

php artisan make:model ContactUs -m

Go to the given path migrations/create_contact_us_table.php, next put the code within migration file to create contact_us table:

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateContactUsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('contact_us', function (Blueprint $table) {
            $table->increments('id');
            $table->string('name'); 
            $table->string('email'); 
            $table->string('phone')->nullable(); 
            $table->string('subject')->nullable();
            $table->text('message');            
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('contact_us');
    }
}

Create the $fillable array, put the ContactUs table value inside app/Models/ContactUs.php modal file:

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class ContactUs extends Model
{
    use HasFactory;
    public $fillable = [
        'name', 
        'email', 
        'phone', 
        'subject', 
        'message'
    ];
}

Run migration with below command:

php artisan migrate

Generating & Organizing Controller

Create a controller where all the logic of showing, storing and validating contact form goes.

From console run the given command to create a new contact controller file:

php artisan make:controller ContactController

Put all the below code in app/Http/Controller/ContactController.php file:

<?php

namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\ContactUs;
use Mail;

class ContactController extends Controller
{

  public function showForm(Request $request) {
    return view('welcome');
  }

  public function storeForm(Request $request) {
      $this->validate($request, [
        'name' => 'required',
        'email' => 'required|email',
        'phone' => 'required',
        'subject'=>'required',
        'message' => 'required'
     ]);

     ContactUs::create($request->all());

    \Mail::send('email', array(
        'name' => $request->get('name'),
        'email' => $request->get('email'),
        'phone' => $request->get('phone'),
        'subject' => $request->get('subject'),
        'form_message' => $request->get('message'),
    ), function($message) use ($request){
        $message->from($request->email);
        $message->to('herry@yahoo.com', 'Hello Admin')->subject($request->get('subject'));
    });

    return back()->with('success', 'Thanks for contacting us.');
  }

}

Start with importing ContactUs model, define two functions…

The showForm() function shows the contact us form in view; its view code will go into the welcome blade file.

In the same way, storeForm() handles the contact form validation in laravel not only but also saves the data into the database.

Build Contact Form Email Blade View

You have to create a new resources/views/email.blade.php file; this file decides the structure of mail template particularly for the main inbox:

<h2>Hello User,</h2>
Email received from: {{ $name }}

User information:

Name: {{ $name }}
Email: {{ $email }}
Phone: {{ $phone }}
Subject: {{ $subject }}
Message: {{ $message }}

Thank you

Setting Up Email Server

Email server configuration is required to send emails related to contact form, so register an account at mailtrap.io.

Get your mailtrap username and password additionally put them into the .env configuration file:

MAIL_MAILER=smtp
MAIL_HOST=smtp.mailtrap.io
MAIL_PORT=587
MAIL_USERNAME=Mailtrap username
MAIL_PASSWORD=Mailtrap password
MAIL_ENCRYPTION=tls

Laravel Sending Email to Admin

Now that email server, as well as SMTP server configurations, have been put at its place, next you have to update ContactController class. Place the below code, which holds the logic to send email to admin once the contact us form has been successfully submitted.

Update the below code in app/Http/Controller/ContactController.php file:

<?php

namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\ContactUs;
use Mail;

class ContactController extends Controller
{

  public function showForm(Request $request) {
    return view('welcome');
  }

  public function storeForm(Request $request) {
      $this->validate($request, [
          'name' => 'required',
          'email' => 'required|email',
          'phone' => 'required',
          'subject'=>'required',
          'message' => 'required'
       ]);

      Contact::create($request->all());

      \Mail::send('mail', array(
            'name' => $request->get('name'),
            'email' => $request->get('email'),
            'phone' => $request->get('phone'),
            'subject' => $request->get('subject'),
            'message' => $request->get('message'),
        ), function($message) use ($request){
            $message->from($request->email);
            $message->to('johndoe@gmail.com', 'Hello Admin')->subject($request->get('subject'));
        });      

      return back()->with('success', 'Thanks for contacting!');
  }

}

Fabricate Routes

Now, open routes/web.php config file, import the controller on top, define routes with GET and POST methods.

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\ContactController;

/*
|--------------------------------------------------------------------------
| 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::get('/contact-form', [ContactController::class, 'showForm']);

Route::post('/contact-form', [ContactController::class, 'storeForm'])->name('contact.save');

First routes call the method to display the contact form while other one stores and validates the contact form.

<h2>Hello User,</h2>
Email received from: {{ $name }}

User information:

Name: {{ $name }}
Email: {{ $email }}
Phone: {{ $phone }}
Subject: {{ $subject }}
Message: {{ $form_message }}

Thank you