iT邦幫忙

2021 iThome 鐵人賽

DAY 20
0
Modern Web

Flask系列 第 20

Day 20 實作表單 (3)

  • 分享至 

  • twitterImage
  •  

前言

今天要來接續表單的製作,不同於前兩天的是,今天的主題比較明確,我們要寫各式各樣的 dashboard 篩選器。

DashboardFilter

第一個就來看看貼文的篩選器。

class DashboardFilterForm(FlaskForm):
    start = DateField("start", format="%Y-%m-%d", validators=[DataRequired()])
    end = DateField("end", format="%Y-%m-%d", validators=[DataRequired()])
    submit = SubmitField("Submit")


class AdminDashboardFilter(FlaskForm):
    start = DateField("start", format="%Y-%m-%d", validators=[Optional()])
    end = DateField("end", format="%Y-%m-%d", validators=[Optional()])
    user_id = IntegerField(
        "", render_kw={"placeholder": "User ID"}, validators=[Optional()]
    )
    submit = SubmitField("Submit")

這裡有一些之前沒出現過的東西,DateField 是一個用來放日期的欄位,他要從 wtforms.fields.html5 引入,他的 format 是指輸出的日期格式。IntegerFieldDateField 一樣從 wtforms.fields.html5 引入,他是一個輸入整數的欄位。Optional 是一個新的 validator,他跟其他 validator 是從同一個地方引入的,它的功用是在這個欄位沒有被填寫的時候不要去做其他的驗證,像是前兩個欄位就會分別做是否是日期跟是否是整數的驗證,如果沒有 Optional 的話,就會直接被擋掉,即便使用者沒有填資料。

上面的 filter 是給一般使用者用的,如果要使用的話就要開始時間和結束時間都要填,所以加上 DataRequired。但下面的是給管理員用的,一樣是二合一的表單,有可能只想用時間或是 user_id 來做篩選,所以不能有 DataRequired,而為了避免被型別驗證擋下來,我們使用 Optional 來避免後續的驗證。

理論上我們還是可以對 startend 做一下兩個都要填的驗證,但此處就略過了。

UserFilterForm

同樣的道理,我們也可以把第一個給一般使用者的篩選器拿來給管理員用來篩選使用者註冊時間,放在管理使用者的頁面。但當然不會這麼簡單就結束,還有一些其他的東西要加入。


class UserFilterForm(FlaskForm):
    user_id = IntegerField(
        "User ID", render_kw={"placeholder": "User ID"}, validators=[Optional()]
    )
    username = StringField("Username", render_kw={"placeholder": "Username"})
    start = DateField("start", format="%Y-%m-%d", validators=[Optional()])
    end = DateField("end", format="%Y-%m-%d", validators=[Optional()])
    submit = SubmitField("Submit")

這裡面有絕大部分都是從上面複製的,所以就不多加解釋。也一樣,我們可以在他後面加入其他 validator 甚至是自己寫的函式,但一樣就先跳過了。

結語

會做篩選器表單不只是因為有一些新東西可以寫,也是因為後面在使用這個表單的時候會用到 cookie,這會是我們唯一一次使用他。

References

Optional


上一篇
Day 19 實作表單 (2)
下一篇
Day 21 實作路徑結構
系列文
Flask30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言