Flask-WTFormsを使用して、htmlのフォームセクションのスタイルを設定するにはどうすればよいですか?

0を返す

Flask-WTFの非常に単純化されたwikiを読みましたが、それを使って何ができるかについてあまり理解できませんでした。私は<form>、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">ですが、今は<input>全体を置き換えていますと{{ form.date }}...クラスを編集する特権を失いました。

デビディズム

WTFormsフィールドは、レンダリングする入力に設定される属性を使用して呼び出すことができます。フィールドを参照するだけでなく、スタイリングやJavaScript機能などに必要な属性をフィールドに渡します。ラベルは同じように動作し、でアクセスできますfield.label

forvaluetypeid、とname彼らは自動的に処理されているとして、渡さする必要はありません。属性の特殊なケースを処理するためのいくつかのルールがあります。属性名がのような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) }}

リンクされたメソッドはどちらも直接呼び出す必要がないことに注意してください。これらのドキュメントは、フィールドを呼び出すときの動作を説明しているだけです。

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

Flask-WTFormsを使用して、htmlのフォームセクションのスタイルを設定するにはどうすればよいですか?

分類Dev

Flask / WTForms-フォームをインラインにするにはどうすればよいですか?

分類Dev

Flask-WTFormsを使用してDRYの方法で反復フォーム要素を作成するにはどうすればよいですか?

分類Dev

Flask-SocketIOを使用してすべてのクライアントにメッセージを送信するにはどうすればよいですか?

分類Dev

Flaskですべてのリクエストに対してアクションを実行するにはどうすればよいですか?

分類Dev

Flask-SQL Alchemyを使用してJSONのフォームから制約エラーを表示するにはどうすればよいですか?

分類Dev

HTMLのフォームからのFlaskでのリクエストがNone値を返しています。どうすればよいですか?

分類Dev

Flask_restplusでSwaggerのベースURLを設定するにはどうすればよいですか?

分類Dev

クライアントリクエストからFlaskのURLにすべてのデータを印刷するにはどうすればよいですか?

分類Dev

アップロードしたファイルをフォームからFlaskを使用してモデルにリンクするにはどうすればよいですか?

分類Dev

Flask-WTFとJinja2を使用して、複数のページにモーダルと同じログインフォームを追加するにはどうすればよいですか?

分類Dev

すべてのテンプレートのflask_adminスタイルをオーバーライドするにはどうすればよいですか?

分類Dev

HTMLでPDFファイルをアップロードしてFLASKバックエンドで処理するにはどうすればよいですか?

分類Dev

PythonとFlaskを使用してTwilioSMS Botアプリケーションでユーザーの電話番号にアクセスするにはどうすればよいですか?

分類Dev

Flaskを使用するローカルシステムで、URLを「localhost」から別のものに変更するにはどうすればよいですか?

分類Dev

ボタン付きのhtmlページとpython付きのflaskを使用してmongodbを検索するにはどうすればよいですか?

分類Dev

構成ファイル内にFLASK_ENVを設定するにはどうすればよいですか?

分類Dev

Flaskに戻るのではなく、フォームをajaxスクリプトに「送信」するにはどうすればよいですか?

分類Dev

JinjaとFlaskを使用して画像フォルダーから画像を動的にレンダリングするにはどうすればよいですか?

分類Dev

POSTリクエストをフォーム(wtforms)からREST api(flask-restless)に正しくリダイレクト/送信するにはどうすればよいですか?

分類Dev

Python / Flask Webアプリの静的フォルダーに保存されているCSSスタイルシートを更新するにはどうすればよいですか?

分類Dev

Flaskフォーム:複数のフォームを使用して、1回のコミットで親エンティティと子エンティティをDBに追加するにはどうすればよいですか?

分類Dev

Flask WTFormsを送信するときに、データベーステーブルからこれらの値を空白にせずに、フィールドを空白のままにするにはどうすればよいですか?

分類Dev

文字列のリストに従ってFlaskでボタンまたはフィールド(フォーム)を生成するにはどうすればよいですか?

分類Dev

Flask test_clientを使用して複数のファイルをアップロードするにはどうすればよいですか?

分類Dev

SQLiteを使用してFlaskでテストスクリプトを設定するにはどうすればよいですか?

分類Dev

MongoEngineとFlask-Loginでセッションを使用するにはどうすればよいですか?

分類Dev

Python、Flask-テンプレートフォルダにクリック可能なリンクを作成して別のページにリダイレクトするにはどうすればよいですか?

分類Dev

Flask-migrate:インストールされている他のモジュールのdbを管理するにはどうすればよいですか?

Related 関連記事

  1. 1

    Flask-WTFormsを使用して、htmlのフォームセクションのスタイルを設定するにはどうすればよいですか?

  2. 2

    Flask / WTForms-フォームをインラインにするにはどうすればよいですか?

  3. 3

    Flask-WTFormsを使用してDRYの方法で反復フォーム要素を作成するにはどうすればよいですか?

  4. 4

    Flask-SocketIOを使用してすべてのクライアントにメッセージを送信するにはどうすればよいですか?

  5. 5

    Flaskですべてのリクエストに対してアクションを実行するにはどうすればよいですか?

  6. 6

    Flask-SQL Alchemyを使用してJSONのフォームから制約エラーを表示するにはどうすればよいですか?

  7. 7

    HTMLのフォームからのFlaskでのリクエストがNone値を返しています。どうすればよいですか?

  8. 8

    Flask_restplusでSwaggerのベースURLを設定するにはどうすればよいですか?

  9. 9

    クライアントリクエストからFlaskのURLにすべてのデータを印刷するにはどうすればよいですか?

  10. 10

    アップロードしたファイルをフォームからFlaskを使用してモデルにリンクするにはどうすればよいですか?

  11. 11

    Flask-WTFとJinja2を使用して、複数のページにモーダルと同じログインフォームを追加するにはどうすればよいですか?

  12. 12

    すべてのテンプレートのflask_adminスタイルをオーバーライドするにはどうすればよいですか?

  13. 13

    HTMLでPDFファイルをアップロードしてFLASKバックエンドで処理するにはどうすればよいですか?

  14. 14

    PythonとFlaskを使用してTwilioSMS Botアプリケーションでユーザーの電話番号にアクセスするにはどうすればよいですか?

  15. 15

    Flaskを使用するローカルシステムで、URLを「localhost」から別のものに変更するにはどうすればよいですか?

  16. 16

    ボタン付きのhtmlページとpython付きのflaskを使用してmongodbを検索するにはどうすればよいですか?

  17. 17

    構成ファイル内にFLASK_ENVを設定するにはどうすればよいですか?

  18. 18

    Flaskに戻るのではなく、フォームをajaxスクリプトに「送信」するにはどうすればよいですか?

  19. 19

    JinjaとFlaskを使用して画像フォルダーから画像を動的にレンダリングするにはどうすればよいですか?

  20. 20

    POSTリクエストをフォーム(wtforms)からREST api(flask-restless)に正しくリダイレクト/送信するにはどうすればよいですか?

  21. 21

    Python / Flask Webアプリの静的フォルダーに保存されているCSSスタイルシートを更新するにはどうすればよいですか?

  22. 22

    Flaskフォーム:複数のフォームを使用して、1回のコミットで親エンティティと子エンティティをDBに追加するにはどうすればよいですか?

  23. 23

    Flask WTFormsを送信するときに、データベーステーブルからこれらの値を空白にせずに、フィールドを空白のままにするにはどうすればよいですか?

  24. 24

    文字列のリストに従ってFlaskでボタンまたはフィールド(フォーム)を生成するにはどうすればよいですか?

  25. 25

    Flask test_clientを使用して複数のファイルをアップロードするにはどうすればよいですか?

  26. 26

    SQLiteを使用してFlaskでテストスクリプトを設定するにはどうすればよいですか?

  27. 27

    MongoEngineとFlask-Loginでセッションを使用するにはどうすればよいですか?

  28. 28

    Python、Flask-テンプレートフォルダにクリック可能なリンクを作成して別のページにリダイレクトするにはどうすればよいですか?

  29. 29

    Flask-migrate:インストールされている他のモジュールのdbを管理するにはどうすればよいですか?

ホットタグ

アーカイブ