In this video we are going to learn about Livewire Form Validation.
So let see how can we validate a form in livewire.
First of all lets create a livewire component.
So switch to the command prompt and for creating livewire component run the command.

php artisan make:livewire Contact

Now run the application

php artisan serve

Now switch to the project and lets create the route for this contact component.
So just go inside the routes directory then just open web.php file and create the route.

Route::get(‘/contact’,Contact::class);

Now just go inside the resources directory then views , layouts then just open app.blade.php file.
This is component default layout file and here lets add bootstrap cnd.
For that just go to the getbootstrap.com.
Click on get started , and from here just copy this css and js cdn.
And paste inside the app.blade.php file.
Now just open contact.blade.php view file and here lets create a from.

<div>
    <section>
        <div class=\"container\">
            <div class=\"row\">
                <div class=\"col-md-12\">
                    <div class=\"card\">
                        <div class=\"card-header\">
                            Contact Form
                        </div>
                        <div class=\"card-body\">
                            <form wire:submit.prevent=\"submitForm\">
                                <div class=\"form-group\">
                                    <lable for=\"name\">Name</lable>
                                    <input type=\"text\" name=\"name\" class=\"form-control\" wire:model=\"name\" />
                                    @error('name') <p class=\"text-danger\">{{$message}}</p> @enderror
                                </div>

                                <div class=\"form-group\">
                                    <lable for=\"email\">Email</lable>
                                    <input type=\"email\" name=\"email\" class=\"form-control\" wire:model=\"email\" />
                                    @error('email') <p class=\"text-danger\">{{$message}}</p> @enderror
                                </div>

                                <div class=\"form-group\">
                                    <lable for=\"phone\">Phone</lable>
                                    <input type=\"text\" name=\"phone\" class=\"form-control\" wire:model=\"phone\" />
                                    @error('phone') <p class=\"text-danger\">{{$message}}</p> @enderror
                                </div>

                                <div class=\"form-group\">
                                    <lable for=\"msg\">Message</lable>
                                    <input type=\"text\" name=\"msg\" class=\"form-control\" wire:model=\"msg\" />
                                    @error('message') <p class=\"text-danger\">{{$message}}</p> @enderror
                                </div>
                                <button type=\"submit\" class=\"btn btn-success\">Submit</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>

Now lets open Contact.php component class file and write the following code.

<?php

namespace App\\Http\\Livewire;

use Livewire\\Component;

class Contact extends Component
{
    public $name;
    public $email;
    public $phone;
    public $msg;

    public function updated($fields)
    {
        $this->validateOnly($fields,[
            'name' => 'required',
            'email' => 'required|email',
            'phone' => 'required|digits:10',
            'msg' => 'required|min:20'
        ]);
    }
    public function submitForm()
    {
        $this->validate([
            'name' => 'required',
            'email' => 'required|email',
            'phone' => 'required|digits:10',
            'msg' => 'required|min:20'
        ]);

        dd($this->name,$this->email,$this->phone,$this->msg);
    }
}

Now its done so lets check it.
So switch to the browser and go to the url /contact.
And here you can see the contact form.
Now just click on submit.
And here you can see the validation error.
Now just enter the name.
And if enter invalid email id, validation error is showing enter valid email id.
Now just enter valid email id.
Now In this phone input field just enter any character.
It showing just enter 10 digits not character .
So just enter valid phone no.
No enter the message if I enter text less than 20 it shows this validation error.
Now enter at least 20 character.
Now there is no any validation error.
Now click on submit.
You can see form submitted successfully.
So in this way we can Validate Livewire Form.