|

How To Validate Form Submissions In Laravel

How To Validate Form Submissions In Laravel

Validating forms has become easier over time for web developers. In the early days, there were some really clunky approaches you had to implement to get some basic validation. Things are much easier these days however, and we’ll look at how to add simple validation to a form submission in Laravel. In our last tutorial, we got a pretty nice form set up to allow us to submit a new game to our games database. Unfortunately, there is no means of validation yet. That means users can easily insert bogus, or even blank data. We will fix this shortcoming right now in this simple tutorial.


Html5 Client Side Browser Validation

Before we even need to implement anything on the server side, let’s go ahead and add HTML5 client side validation to our form. It’s as easy as adding a simple required attribute to the input tags on our form. Look at the highligted tags below to see how we do this.


resources/views/games/create.blade.php

Trying to submit a form that is not filled out properly now gives the user some feedback about where they may have missed something or messed up.
html5 client side validation in action


Adding Validation To The store() Method

Simple html5 browser validation is great, but it is not 100% foolproof. You will still need to validate data on the server side before ever trying to insert anything into the database. This is really easy to do in Laravel. Here we add some simple validation rules to our store() method, using the $this->validate() method in our controller.


app/Http/Controllers/GamesController.php

With the highlighted code above, we now have some validation in place on the server side as well. There are *a lot* of validation rules available to you, but we just want to make sure each field is required. In addition to this, we want the title of the game to be unique. We don’t want to add the same game to the database twice.


Displaying Errors If Needed

If the validation passes, the store() method just continues to go about it’s business of inserting the provided data into the database. If there was a problem however, an $errors variable will be populated and the user is re directed back to the form from which they came. By reaching into that variable, we can display the errors to the user. Here is how we might update our view file to handle this task.


resources/views/games/create.blade.php

In one of our earlier posts, we had added The Legend of Zelda to the games table in our database. Let’s try to add it again and see what happens.
laravel server side validation in action

Excellent! So even though we filled out all of the fields properly in the form, and got the html5 client side browser validation to pass, we get a nice error message to tell us that the title we provided has already been taken. So our validation rule we provided in the store() method of our GamesController worked great. Recall we specified we want a unique title by the rule of ‘title’ => ‘required|unique:games’.


Prevent The Form From Clearing Data

Everything works great right now, but did you notice something about the data we had typed into the form? It is gone. If we make a mistake during the process of filling out the form, then try to submit, all of our data gets cleared out upon redirection. Now the user needs to fill out every field of the form again, rather than being able to fix the one error they might have made. We can fix this in our view file by adding a value attribute and making use of the old() function Laravel provides. Let’s see how.


resources/views/games/create.blade.php

laravel old function to repopulate form data

This is great now. We have redirected back to the form, yet the form data we originally typed in is retained. You definitely want to handle things like this to improve the user experience. Note that the old() function accepts an argument of the name of the field to repopulate. In other words, whatever the value is that is set to the name attribute for the given input tag, should be the same value passed to the old() function.


Extracting Form Errors To a Partial

The markup that we used in our create.blade.php file to display form errors is pretty standard boilerplate stuff that can be used elsewhere. It makes sense to extract that markup to it’s own partial. Let’s create a file in resources/views/partials named formerrors.blade.php and populate with the stated markup.

Now in our create.blade.php file we just include it like so, and everything continues to work as we would expect.

With these steps in place, we have a decent little validation system going in our games database app. Let’s finish off by adding one more game that we know meets all requirements to be sure we are still able to add a new game to the database as we expect. We fill out the details of our Metroid game to be submitted.
submitting new game

It looks like our addition is working great!
games are adding perfectly

With these steps in place, we now have validation that makes sure users are entering the right data to be submitted in our forms. If things are good, we add the data to the database. If things do not meet the requirements we specified, then users are given a list of errors to correct before trying again.


How To Validate Form Submissions In Laravel Summary

This tutorial took us a step further along in our learning of Laravel. We took our little games app, and first added some simple html5 browser side validation to our form with the required attribute. From there, we saw how to add validation on the server side as well by making use of the $this->validate() method Laravel provides to us. We then saw that it is necessary to add some markup to our form so that we can display errors if validation fails. We did this by looping over the contents of the $errors variable. Finally, we saw that since the error markup is repeatable code, we can extract that markup to a partial view file which can be reused on other forms if need be. Bravo!