The solution code in the previous lesson is created by following the Flask-WTF Quickstart. This is what we think most students should be able to write after reading the Quickstart (and 60 days of Python under their belts). However, if you read the WTForms documentation in its entirety, you'll realise that we can improve the code we wrote.
1. We can change the password
input to use a PasswordField
from WTForms, this will obscure the text typed into the input.
There are plenty of other fields you can read about in the WTForms documentation:
https://wtforms.readthedocs.io/en/3.0.x/fields/#basic-fields
2. The arguments given when creating a StringField
or PasswordField
is for the label
property of the form field. Even though the Quickstart doesn't add it, I prefer adding the keyword argument when it's not clear what the argument is for.
This is the label
property in use in login.html when our form
object is passed over.
3. You might have already done this, but in the Quickstart, they set the form action to "/"
, which is a static path. It's always a good idea to use dynamically built urls like this:
4. We can also better format the layout of the labels and inputs in our WTForms generated form by using normal HTML elements.
e.g.
This will result in the following layout:
5. Finally, did you spot the SubmitField
when you were looking at the documentation in Step 1 ? This can be used to replace the submit input/button.
This is the code we have after all 5 code improvements:
https://gist.github.com/angelabauer/e5b1a26a79888f67b490c1f53ed2496c