Preview

Start a free Courses trial
to watch this video

Re-populating Data when Validation Fails

Name: Re-populating Data when Validation Fails
Uploaded: 2016-06-20T18:54:16Z
Duration: 352 s
Description: What your application does when it receives invalid data is just as important as what it does when it receives valid data. With this in mind, we discuss the process of redirecting back to the category form with the data they already entered populated into their respective fields.

5:52 with Chris Ramacciotti

What your application does when it receives invalid data is just as important as what it does when it receives valid data. With this in mind, we discuss the process of redirecting back to the category form with the data they already entered populated into their respective fields.

Teacher's Notes
Video Transcript
Downloads

Git Command to Sync Your Code to the Start of this Video

git checkout -f s4v4

Using Github With This Course

You can complete this course entirely using code created by you on your local machine. However, if you choose to use the code I've made available to you, you have two options:

Use the project files linked at the bottom of this page, or
Use the Github repository I've made available (recommended)

If you choose the recommended option of using the Github repository, it can be found at

https://github.com/treehouse/giflib-hibernate

To utilize Github with this course, you can download the Github desktop client for your system or use the command line interface provided with Git.

Clone this repository to your machine using the Github desktop client, or using the following command:

git clone git@github.com:treehouse/giflib-hibernate.git

To update your local repository to match a video's starting point, you can use the git checkout command in combination with the stage and video number. For example, to update your local repository to match the starting point of Stage 5, Video 4, you'd use the following:

git checkout -f s5v4

Notice the use of the -f option. This forces Git to override all local changes, so be aware: this will cause any changes you made to be lost.

Now that we know how to detect errors and 0:00

redirect back to a form when we do see an error we have three tasks left. 0:02

First, we'll need a place to display those errors in our Thymeleaf templates. 0:06

Second, we need to make error messages 0:10

available to the templates from our controller. 0:12

And last we'll also make available to our Thymeleaf templates any data that 0:15

the user had previously entered, so that it doesn't have to be retyped, ready? 0:20

Let's do it. 0:25

First, let's tackle the issue of redisplaying the data a user has entered 0:27

if validation has failed, so that it doesn't have to be retyped. 0:31

This is where we can take advantage of that timely 0:35

object binding we talked about earlier in the course. 0:38

Let me open the category form to remind you of that, 0:41

here in the form element is where we bound. 0:44

That object called category and inside this form element, 0:48

that is some of its child elements. 0:53

Namely, the input and select element 0:54

refer to some of the properties of that bound object using this asterisk here. 0:57

Now as long as Thymeleaf has an object name category in the model map, 1:03

it will use the categories properties in pre populating the form field values. 1:08

In our case, the name and the color code. 1:12

So back to the category controller. 1:16

What we need to do is add this category that's passed into this controller method 1:19

here to the model map. 1:23

The problem is that we're redirecting, so 1:25

that if we were to include a model parameter here and add it as an attribute, 1:27

that attribute wouldn't survive past the processing of this current request. 1:31

But we do need it to survive the redirect that is we need it to be available 1:35

on the next request, the one that we're redirecting to. 1:40

That is this categories/ add request. 1:43

Thankfully, Spring offers a solution for this and 1:47

that is the redirect attributes object. 1:49

If we add a redirect attributes parameter to this method, 1:52

any flash attributes added will survive exactly one redirect. 1:55

So let me add a RedirectAttributes parameter here. 2:00

RedirectAttributes and I will call it the same thing. 2:03

And now, if we do detect errors, let's include the category object that 2:09

was submitted so that it's available upon redirect. 2:14

So here, I'm gonna add the category if invalid data was received. 2:17

So the way we'll do that is the following. 2:25

We will use the add flash attribute method that will make the attribute survive 2:28

exactly one redirect and any subsequent requests won't include this exact data. 2:33

Here's how it looks, we'll use that redirect attributes parameter value and 2:39

we will addFlashAttribute just like this. 2:43

We'll call it category and we'll add whatever category 2:47

was passed into this method which would be a compilation of values that 2:52

came from the POST Request that is from the form data that the user submitted. 2:57

Before we take our changes for a spend, let's take a peek at one more item. 3:03

Think about this if evaluation fails, 3:08

we're gonna redirect back to this add form. 3:10

Now let's go to the method that renders this view and 3:13

keep in mind that we're adding a category object here to be available for 3:18

exactly one redirect. 3:22

Let's go up to the method that processes the form itself. 3:25

Let me find that one. 3:31

Here it is, formNewCategory. 3:32

Looking closely, 3:35

it appears that even if we redirected with the category item included in the model. 3:37

We are replacing it here with a newly constructed category object which will 3:43

blow away all of the data that was previously entered by the user. 3:48

So let's make sure not to overwrite that if one does exist and 3:53

the way we do that is the following. 3:58

We say, if the (!model.containsAttribute("category")), 4:01

then we'll add a new category to the model. 4:08

And if it does contain a model attribute named category. 4:13

Well, we won't add another one because that must mean a user had submitted 4:17

invalid data. 4:21

And we added a category attribute that included that category 4:22

object with invalid data and that will be the one we want to use in the form. 4:25

All right, with that in place, let's reboot this app. 4:30

And see if we successfully redirect if there are errors and 4:33

include the previously entered data in the form. 4:36

So I will stop my previous instance of the app and i will rerun that. 4:39

Looks like it compiled successfully and we get all the way down 4:48

to the message that says the application started successfully. 4:52

Cool, let me switch to Chrome now. 4:56

Let me try to add a category here and I will specify a color, but 4:59

I will completely omit the Category Name. 5:04

So i will Add that and great! 5:08

We're back at the form with the color that we previously chose, so 5:11

we don't have to choose that again. 5:13

Now let's check out that size validation by trying to add a category with 5:16

both say two characters, say Hi. 5:19

And I will add that and there again, we're back at the form seeing 5:22

the data we already entered so we don't have to re-enter that. 5:27

Now finally, 5:31

let's make sure we can still successfully add a category of all data is valid. 5:32

Let me finish this here with Hibernate and click Add, great! 5:37

We're done with that part and next, 5:45

we'll tackle the display of validation messages in our Thymeleaf templates. 5:47

You need to sign up for Treehouse in order to download course files.

Spring with Hibernate

Re-populating Data when Validation Fails

Git Command to Sync Your Code to the Start of this Video

Using Github With This Course