We’ve now covered the operation cycle of forms using FlaskWTF. Now let’s look at some additional form fields included in WTForms.
TextAreaField
The TextAreaField is a text field that supports multi-line input. The data returned from a TextAreaField
instance is a string that may include more whitespace characters such as newlines or tabs.
#### Form class declaration my_text_area = TextAreaField("Text Area Label")
BooleanField
A checkbox element is created using the BooleanField object. The data returned from a BooleanField
instance is either True
or False
.
#### Form class declaration my_checkbox = BooleanField("Checkbox Label")
RadioField
A radio button group is created using the RadioField
object. Since there are multiple buttons in this group, the instance declaration takes an argument for the group label and a keyword argument choices
which takes a list of tuples.
Each tuple represents a button in the group and contains the button identifier string and the button label string.
#### Form class declaration my_radio_group = RadioField("Radio Group Label", choices=[("id1", "One"), ("id2","Two"), ("id3","Three")])
Since the RadioField() instance generally contains multiple buttons it is necessary to iterate through it to access the components of the subfields.
Instructions
A common practice when creating web forms with Flask is to define the forms in a separate file and import them into the main app.
CommentForm
has been moved to the new file forms.pyRecipeForm
is fully functional and has been added to forms.pyRadioField
has been added to thewtforms
import statement- The list
recipe_categories
inRecipeForm
holds the 3 radio button tuples.
Run the code to move on.
In forms.py create a radio field instance and assign it to recipe_type
. The instance should have the label "Type"
and recipe_categories
should be assigned to the keyword argument choices
.
In index.html a table has been added to contain our radio buttons. Inside the for loop that iterates through the 3 buttons, use the loop variable btn
to insert the button field in the first <td>
tag and the field label in the other <td>
tag pair.
Lastly, in the index
route of app.py add the recipe_type
data from the form to types[new_id]
.
When you’re done give the recipe form a try with the new radio buttons.