プログラミング

【WTForms】IntegerFieldを使ってみる

投稿日:2021年1月5日 更新日:

今回は「wtforms」の「IntegerField」を使ってみたいと思います。

IntegerFieldを使ってみる

「Integer」とは「整数」という意味です。
なので「整数」のみ受け取るフォームを作れるはずです。
それでは見ていきましょう。

Flask-WTFについてはこちら。

IntegerFieldをインポートしよう

from flask import Flask, render_template
from flask_wtf import FlaskForm
from wtforms import IntegerField

これでいいですね。

クラスを定義しよう

from flask import Flask, render_template
from flask_wtf import FlaskForm
from wtforms import IntegerField

-----------------------------------------------------------
app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret'

class LoginForm(FlaskForm):
   field = IntegerField('テスト')

次に関数を定義します。

関数を定義しよう

from flask import Flask, render_template
from flask_wtf import FlaskForm
from wtforms import IntegerField

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret'

class LoginForm(FlaskForm):
   field = IntegerField('テスト')

-------------------------------------------------------
@app.route('/test', methods=['GET', 'POST'])
def test():
   test = LoginForm()
   if test.validate_on_submit():
      return '<h1>結果は {}.'.format(test.field.data)
   return render_template('test.html', test=test)

if __name__ == "__main__":
   app.run(debug=True)

「test」関数を定義しました。
それでは「hmtl」の方も作っていきます。

htmlファイルを作成しよう

フォームを作成する「htmlファイル」を作っていきましょう。

<html>
   <head>
   <title>Test</title>
  </head>
  <body>
     <h1>テスト</h1>
     <form method="POST" action="{{ url_for('test') }}">
        {{ test.csrf_token }}
        {{ test.field.label }}
        {{ test.field }}
        <div>
           {% for error in test.field.errors %}
           <span style="color: red;">{{ error }}</span>
           {% endfor %}
        </div>
        <input type="submit" value="送信">
      </form>
  </body>
</html>

では「整数」のみ受け取るのか、確認してみましょう。

IntegerFieldの確認をしてみよう

「test.py」を実行して、ローカルサーバーにアクセスしましょう。

フォームが無事に出力されました。

「12.34」と入力してみましたが、はじかれましたね。

一応「あいうえお」という文字でも試してみました。
それでは「整数」を入力してみます。

「1234」は「整数」なので受け取ってくれたようです。

まとめ

「IntegerField」を試してみました。
これまで「StringField」と「PasswordField」にも触れました。
まだまだ種類がありそうなので、色々と確認していきましょう。
それではまた。

-プログラミング
-

執筆者:


comment

メールアドレスが公開されることはありません。

関連記事

【Python】ANACONDAのインストール

今回は実際に「ANACONDA」をインストールしていきます。既にPythonをインストールしている方はアンインストールしといたほうがいいみたいですね。 ANACONDAのインストール ではまずソフトを …

【Python】Excelファイルを読み込もう

前回作成したExcelファイルを読み込んでみたいと思います。今回も「openpyxl」を使っていきますよ~。 Excelファイルを読み込んでみよう openpyxlをインポートしよう まず、「open …

プログラミング学習のツール

緊張しながら初めての投稿です。現在までHTML、CSS、PHPの基礎を勉強しています。 今回は自分が使用している学習ツールについてご紹介します。 ドットインストール 自分はドットインストールというもの …

社内イントラネットに掲示板作成してみた。①

自分の仕事はプログラミングとは無縁なのですが、業務でもプログラミングを勉強、活用したいと思い取り組んでみました。その題材が「社内イントラネットに掲示板作成してみた。」です。今回は掲示板を作成するうえで …

社内イントラネットに掲示板作成してみた。②

「社内イントラネットに掲示板作成してみた。①」に続きましてIISのインストール方法を紹介します。 社内イントラネットに掲示板作成してみた。① IISを使用するメリット 「ASP」を使用して動的なサイト …

YouTube