<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('contacts', function (Blueprint $table) {
$table->bigIncrements('id');
$table->string('name');
$table->string('email');
$table->text('body');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('contacts');
}
};
C:\xampp82\htdocs\lva8\routes\web.php
<?php
use Illuminate\Support\Facades\Route;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider and all of them will
| be assigned to the "web" middleware group. Make something great!
|
*/
Route::get('/', function () {
return view('welcome');
});
Route::get('/form', function () {
return view('form');
});
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Contact extends Model
{
use HasFactory;
protected $fillable = ['name', 'email', 'body'];
}
<?php
namespace App\Livewire;
use App\Models\Contact;
use Livewire\Component;
class ContactForm extends Component
{
public $name;
public $email;
public $body;
public function submit()
{
$validatedData = $this->validate(
[
'name' => 'required|min:6',
'email' => 'required|email',
'body' => 'required'
]
);
Contact::create($validatedData);
return redirect()->to('/form');
}
public function render()
{
return view('livewire.contact-form');
}
}
By Hardik Savani May 9, 2020 Category : LaravelPlayUnmuteLoaded: 1.20%FullscreenThis tutorial shows you laravel livewire form example. I’m going to show you about create form with laravel livewire. let’s discuss about laravel livewire tutorial. you will learn how to install livewire to laravel.
In this tutorial, we will create simple form using laravel livewire. you can use laravel livewire with laravel 6, laravel 7, laravel 8 and laravel 9 version.
Livewire is a full-stack framework for Laravel framework that makes building dynamic interfaces simple, without leaving the comfort of Laravel. if you are using livewire with laravel then you don't worry about writing jquery ajax code, livewire will help to write very simple way jquery ajax code using php. without page refresh laravel validation will works, form will submit etc.
Here, i will give you very simple example to creating contact form with name and email and i will store that data to database without refresh page and too many lines of code in blade file. we will use only livewire/livewire package.
So, let's follow bellow step and you will get bellow layout:
Step 1 : Install Laravel 7
first of all we need to get fresh Laravel 7 version application using bellow command, So open your terminal OR command prompt and run bellow command:
composer create-project --prefer-dist laravel/laravel blog
Step 2 : Create Migration and Model
Here, we need create database migration for files table and also we will create model for files 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.
*/
public function up(): void
{
Schema::create('contacts', function (Blueprint $table) {
$table->bigIncrements('id');
$table->string('name');
$table->string('email');
$table->text('body');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('contacts');
}
};
php artisan migrate
now we will create Contact model by using following command:
php artisan make:model Contact
App/Contact.php
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Contact extends Model
{
use HasFactory;
protected $fillable = ['name', 'email', 'body'];
}
<?php
namespace App\Livewire;
use Livewire\Component;
class ContactForm extends Component
{
public function render()
{
return view('livewire.contact-form');
}
}
C:\xampp82\htdocs\lva8\resources\views\livewire\contact-form.blade.php
<div>
{{-- Care about people's approval and you will be their prisoner. --}}
</div>
Now both file we will update as bellow for our contact us form.
app/Http/Livewire/ContactForm.php
<?php namespace App\Http\Livewire; use Livewire\Component;use App\Contact; class ContactForm extends Component{ public $name; public $email; public $body; public function submit() { $validatedData = $this->validate([ 'name' => 'required|min:6', 'email' => 'required|email', 'body' => 'required', ]); Contact::create($validatedData); return redirect()->to('/form'); } public function render() { return view('livewire.contact-form'); }}
now we will create one route for calling our example, so let's add new route to web.php file as bellow:
routes/web.php
Route::get('/form', function () { return view('form');});
Step 6: Create View File
here, we will create blade file for call form route. in this file we will use @livewireStyles, @livewireScripts and @livewire('contact-form'). so let's add it.