使用Flask-WTForms，我如何設計我的HTML表單部分？

我通過Flask-WTF極其簡化的維基閱讀，並不能理解我能用它做什麼。我的印象是，HTML的<form>部分現在只能像使用Flask-WTForms，我如何設計我的HTML表單部分？

<form method="post"> 
    {{ form.hidden_tag() }} 
    {{ form.name }} 
    <input type="submit"> 
</form>

但我真的想樣式我使用物化如：

 <div class="row"> 
      <div class="input-field col s6"> 
       <i class="material-icons prefix">account_circle</i> 
       <input value="FN" id="first_name" type="text" class="validate"> 
       <label class="active" for="first_name">First Name</label> 
      </div> 
      <div class="input-field col s6"> 
       <input value="LN" id="last_name" type="text" class="validate"> 
       <label class="active" for="last_name">Last Name</label> 
      </div> 
     </div>

我在哪裏可以適應{{ form.first_name }}和{{ form.last_name }}成？

編輯：讓我闡述我的答案多一點：例如，我想是這樣物化datepicker（一個很好的彈出日曆，讓用戶選擇日期），這應該是在<input class='datepicker' length="50">，但現在我正在用{{ form.date }}替換整個<input>行......我失去了編輯該類的特權，而不是。

來源

2016-01-12 return 0

WTForms字段可以是called，其屬性將在它們呈現的輸入上設置。將樣式，JavaScript功能等所需的屬性傳遞給字段，而不僅僅是引用字段。標籤的行爲方式相同，可以通過field.label進行訪問。

for，value，type，id和name不需要通過，因爲它們會自動處理。有一些rules用於處理屬性的特殊情況。如果屬性名稱是Python關鍵字（例如class），請附加下劃線：class_。虛線不是有效的Python名稱，因此單詞之間的下劃線被轉換爲破折號; data_toggle變成data-toggle。

{{ form.first_name(class_='validate') }} 
{{ form.first_name.label(class_='active') }} 

{{ form.begins(class_='datepicker', length=50) }}

請注意，不需要直接調用任何鏈接的方法，這些文檔只是描述調用字段時的行爲。

來源

2016-01-12 16:28:18 davidism

使用Flask-WTForms，我如何設計我的HTML表單部分？

回答

相關問題