Skip to Content
Learn
Flask Forms
More Form Fields

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

1.

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.py
  • RecipeForm is fully functional and has been added to forms.py
  • RadioField has been added to the wtforms import statement
  • The list recipe_categories in RecipeForm holds the 3 radio button tuples.

Run the code to move on.

2.

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.

3.

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.

4.

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.

Folder Icon

Sign up to start coding

Already have an account?