A Simple Create Post Form with Validation

Written by SarahS

15th November 2019

A simple form with basic validation.


public function store()
            'title' => 'required',
            'body' => 'required'

        // persist the resource
        $article = new Article();
        $article->title = request('title');
        $article->body = request('body');


        return redirect('/articles');



          <form action="/articles" method="POST">
                <div class="field">
                    <label class="label" for="title">Title</label>

                    <div class="control">
                            class="form-control @error('title') is-invalid @enderror" 
                            value="{{ old('title')}}">

                        <p class="invalid-feedback">{{$errors->first('title')}}</p>
                <div class="field">
                    <label class="label" for="body">Body</label>

                    <div class="control">
                            class="form-control @error('body') is-invalid @enderror" 
                            value="{{ old('body')}}"></textarea>
                        <p class="invalid-feedback">{{$errors->first('body')}}</p>
                <div class="field is-grouped">
                    <div class="control">
                    <button type="submit" class="btn btn-primary mt-2 mb-2">Submit</button>

This simple form shows the browser validation that can be done with Laravel and Bootstrap.


Line 2 uses the Laravel @csrf Blade directive to prevent against cross-site request forgery (CSRF) attacks. This line includes a hidden CSRF token field in the form so that the CSRF protection middleware can validate the request. All your forms should have this directive.

Input highlighter

When an error shows on your form you can highlight the relevant input fields by using the @error directive. These are shown on lines 8 and 24.

class="form-control @error('title') is-invalid @enderror" 

This shows the tertiary operator for the @error Blade directive. This holds any error messages and by checking this you can add the is-invalid Bootstrap CSS value to the input class. If there are no error messages this class will not show.

Hold previous inputted data

If there is an error you can still hold the previously inputted form data on post back using the

value="{{ old('title')}}"

code as seen on line 12.

Show error messages

Exact error messages can also be provided to the user with the code shown on lines 14-16 and 28-30:

    <p class="invalid-feedback">{{$errors->first('body')}}</p>

This uses the Blade if statements and in between a paragraph is shown using the Bootstrap invalid-feedback class which highlights the text in red. The exact error is then shown again from the $errors variable.

This is one of my Laravel posts. I am currently learning Laravel. When I have learnt something I know I'll be coming back to I find it useful to write out the key points in a post so that it is cemented in my brain! It is also useful as a repository so that I can come and find it again when I need it. If these posts help anyone else, then great. If you see an error in one of my posts, then please let me know below. Thanks for reading.

13 + 11 =

Faster Laravel Hosting

If this post helped you or if you have any questions please leave me a comment below:


You May Also Like…