Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
We have a model, we have a form. It's time to build a view and template to let people sign up for our app.
New Terms
-
form.validate_on_submit()
- When the form is submitted through POST, make sure the data is valid. - Macro - A custom, executable bit of templating.
-
form.hidden_tag()
- Renders hidden fields inside of a hidden<div>
.
More information about macros.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
Okay, we have a form, but we're not using
it.
0:00
Since we're using Flask-WTF, we have a
couple of really nice convenience methods.
0:04
Let's write our register view and
0:08
explore what all we have available when we
use forms.
0:09
Okay, after all that work in forms, we
want to be able to render this one,
0:13
we want to send it to a template.
0:17
So let's go over here to our app.py and
0:18
we're going to import a couple of more
things.
0:22
It's gonna get kinda long so I'm gonna put
parentheses around this too cuz, you know,
0:24
we're gonna be importing a lot of stuff.
0:28
So we needed to bring in our
render_template cuz we know we're gonna
0:30
render a template.
0:33
Let's bring in flash cuz we're probably
gonna wanna send out some flash messages.
0:35
Let's bring in redirect because after the
form is submitted correctly, with,
0:39
you know, the appropriate values, we
probably want to redirect back or
0:43
send them to somewhere else.
0:46
And then if we're gonna do redirects,
0:48
we're gonna need url_for so that we can
bring in some stuff.
0:50
And we didn't go to a new line yet, but I
bet we will later.
0:55
Okay, so we've imported our models.
0:58
Let's go ahead and import our forms, too.
1:01
Again, we're gonna have more than one
form, so
1:03
we'll just import the whole module.
1:06
Let's go add this route.
1:08
And it's going to be app.route and let's
say register and our methods for
1:11
this are going to be get and post, because
we want them to be able to load the view,
1:17
and that way they'll be able to see the
template and they'll see the form.
1:23
And then we also want them to be able to
post back to the view so
1:27
it processes the form.
1:30
So, let's say def register, I'm not going
to take anything.
1:32
And then we're gonna create a form.
1:37
And this is going to be
forms.registerForm.
1:39
And we don't have to send them any
information to RegisterForm.
1:43
Flask and Flask-WTF are smart enough that
they know like, oh,
1:47
some information came in through the post,
let's go ahead and send that.
1:51
Speaking of that being smart, we're gonna
add another line here,
1:55
if form.validate_on_submit()
2:00
So what this method does, it belongs to
the form, and it detects that they have
2:02
valid, or, not validated, sorry, they've
submitted the form, it's been posted.
2:07
And we run the validation, remember all
the validators that we added?
2:12
And it comes back as either, everything is
good, or things are missing.
2:15
So that's all we're gonna deal with here.
2:20
So if it comes back and it's valid, then
we're gonna flash up a message, and
2:23
let's say yay, you registered!
2:27
And the something I'm actually gonna add
here that we didn't do the last time that
2:30
we did flash messages, is I'm gonna add in
the message category.
2:34
Though the category for this is going to
be success.
2:39
These will be more important, and more
obvious, a little later on,
2:43
when we, finish building out all of our
HTML and we start showing flash messages.
2:46
Okay, so things are good.
2:51
We've flashed up this message, and
2:52
then we're going to create
model.User.create_user.
2:54
We're gonna create a user.
2:57
Now, how do we get the data out of our
form?
2:59
So we're gonna say, name, username is
equal to form.username.data.
3:02
And we're gonna say email is equal to
form.email.data.
3:08
And password is equal to
form.password.data.
3:13
Okay?
So
3:17
we're just pulling out these individual
fields.
3:18
And then we're going to return a redirect
URL for index so
3:21
we should probably create an index view
here in a minute.
3:26
And then regardless of what goes on,
3:29
if we don't do the redirect, then we're
going to render the template and
3:33
we'll render register.html and we'll pass
it our form.
3:37
All right.
So let's talk about templates,
3:41
because we need to make a template.
3:43
Actually let's go ahead and make, just
real quick, app.route, forward slash,
3:45
just at home page, index will return hey.
3:50
All right.
3:54
We'll do a lot more on the index page
later, just for
3:54
right now though we'll just have it send
back some text.
3:57
So templates.
4:00
We need to make a new folder that's named
template.
4:01
And then inside there we need to make a
new file that is register.html.
4:05
So let's think about this.
4:11
I don't have a layout.html yet.
4:13
I don't wanna bother with making one just
yet, so let's just start writing our form.
4:15
Method equals post.
4:20
And action equals here, which that just
redirects back to here.
4:22
And I'll give it a class of form, think
that's needed in our CSS.
4:28
So form has been passed in and we need to
render this form in some way.
4:33
So, the first thing we need to do, is
render this form.hidden_tag()
4:38
So what this does is it creates a div that
has a style attribute so it's hidden.
4:44
It, it won't show up in your browser.
4:49
And inside of there, is where it puts
whatever hidden tags are in your form.
4:53
So for instance, we're going to have a
CSRF, or C surf tag, that's inserted into
4:58
this, to make things nice and safe, so our
forms have to be submitted from our site.
5:03
That'll get rendered in here.
5:08
If we need other forms to be hidden, or
fields to be hidden, then,
5:09
they would go in here, as well.
5:14
We don't have any, but if your, later work
does.
5:15
Okay.
So now, let's say for field in form.
5:19
These are our fields.
5:24
Div class equals field.
5:27
And inside that, if field.errors, so
5:29
if there's any errors on the field,
5:34
then for error in field.errors,
5:38
div class equals notification error.
5:43
And then we wanna print out the error.
5:48
We gotta end our for, we gotta end our if.
5:50
And let's, let's take these two and have
those end.
5:56
And then we have to do field, and then we
want to render
5:59
a placeholder inside the field, and we
want that to be the field's label,
6:04
and then the text that belong to that
field's label.
6:08
And so, for example, we have our, let me
finish this, I'll come back over here.
6:12
If we look at forms.py, our username
field,
6:17
we have this label here of username, so
here in register.html
6:21
this placeholder is going to be username
because that's the text of our label.
6:26
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up