【Django】フォームの作成:forms.pyにフォームクラスを定義する(forms.Form)

時計 2021.06.26 / 時計

【Django】フォームの作成:forms.pyにフォームクラスを定義する(forms.Form)

本記事ではDjangoフォームを作成する方法について解説していきます。

Webアプリケーションにおいてフォームは必ず使用しますよね。

Djangoでフォームを作成するには、forms.pyにフォームクラスを定義して、views.pyからテンプレートにフォームクラスを渡すことで実現できるようになっています。

フォームクラスの定義は主にforms.Formまたはforms.ModelFormのどちらかを利用します。
本記事ではforms.Formを利用したフォーム作成方法を解説しています。

本記事を通して以下の知識を学べます。

学べる知識
  • Webアプリケーションにおけるフォームについて
  • Djangoでフォームを作成する方法
  • forms.py内にforms.Formを使ったフォームクラスの定義方法
  • views.pyからテンプレートにフォームクラスを渡す方法
  • テンプレートにフォームを表示させる方法

フォームとは

Webサイトでアカウント登録をするときに個人情報(名前や住所、年齢など)を入力しますよね。このようなユーザーが入力する場所のことをフォームといいます。

Webサイトのフォーム画面

ユーザーがフォームに入力した情報は、送信ボタンを押すことでサーバー(Django)に送られます。Djangoでいうと、送信された情報はviews.pyで受け取り、データベースへ登録するなどの操作をします。

ログインするときにIDやパスワードを入力する場所もフォームと言います。

これらフォームに入力する情報は、入力するべき情報が決まっています。例えばメールアドレスフォームであればメールアドレスを、電話番号であれば電話番号が入力される必要があります。

これらフォームの入力が正しいか確認する機能がフォームには備わっています。
その入力チェックの機能をバリデーションと呼びます。

メールアドレスであれば@が必ず入力される必要がありますし、電話番号であれば数値である必要があります。
こういったフォーム毎のルールをバリデーションは確認しています。

Djangoでフォームを作成する方法

Djangoでテンプレート(HTMLファイル)にフォームを作成には、以下のような方法があります。

  • forms.pyにforms.Formを継承したフォームクラスを使用
  • forms.pyにモデル(forms.ModelForm)を利用したフォームクラスを使用
  • テンプレート(HTMLファイル)に直接inputタグを記述して作成

Djangoでは主にforms.Formを利用した方法とforms.ModelFormを利用した2つの方法どちらかを使用します。

forms.ModelFormはモデルを利用するため、コーディング量が少なくなり、簡単にフォームを定義できるというメリットがあります。

forms.Formは一からフォームを定義しなければなりませんが、応用が利くというメリットがあります。

どちらの方法も、Djangoが提供しているフォーム機能(django.forms)を利用します。

本記事ではforms.Formを継承したフォームクラスを使った、フォームの作成方法を解説していきます。forms.ModelFormを利用したフォームの作成については以下記事をご参照ください。

本記事で作成するフォーム画面

本記事で作成するフォーム画面を以下に記します。

作成するDjangoのフォーム画面

このフォーム画面を作成する流れを見ていきましょう。

Django:フォームを作成する流れ

下記にフォームを作成し、テンプレートに表示するまでの流れを示します。

  1. forms.pyを作成する
  2. forms.pyにforms.Formを継承したフォームクラスを定義する
  3. views.py:テンプレートにフォームクラスを渡す
  4. テンプレートにフォームを表示させる

1.forms.pyを作成する

アプリケーションフォルダ内にforms.pyを作成します。

Djangoアプリケーションのファイル階層構造は次のようになっています。

Djangoアプリケーションのファイル階層構造

作成したforms.pyにフォームクラスを定義して、そのフォームクラスを使ってテンプレートにフォームを表示させます。

2.forms.Formを継承したフォームクラスを定義する

フォームクラスとは、テンプレートに簡単にフォームを表示するための仕組みの一つです。

フォームクラスはdjango.forms.Formのサブクラスとして定義します。
そのためforms.pyの先頭では以下のようにdjango.formsをインポートします。

from django import forms

そしてフォームクラスを定義する際は、forms.Formを継承します。

class クラス名(forms.Form):

いきなりモデルの話をしますが、models.py内に作成するModelクラスは、1つ以上のフィールドを定義します。
これらフィールドはデータベースのカラムデータの型に対応します。

from django.db import models

class Person(models.Model):
    first_name = models.CharField(blank=True, max_length=50)
    last_name = models.CharField(blank=True, max_length=50)
    paid_member = models.BooleanField()

フォームクラスでも、Modelクラスのようにフィールドを定義します。
このforms.Formを継承して生成するフォームクラスのフィールドは、HTML上の<imput>タグに対応します。

フィールドとは簡単に言うと、データの種類を表すための型であると言えます。

フォームクラスのフィールドは次のように定義します。

変数 = forms.フィールドの型(オプション)

ちなみにModelFormではモデルのフィールドと<input>タグが対応するようになります。

ここまで解説してきたフォ-ムクラスの定義をまとめると、フォームは次のように定義するということがわかります。

from django import forms

class クラス名(forms.Form):
    変数 = forms.フィールドの型(オプション)
    変数 = forms.フィールドの型(オプション)
    変数 = forms.フィールドの型(オプション)

フォームクラス定義の例

forms.Formを利用したフォームクラスを定義する例を下記に記します。
ここでは会員登録する際に使用するフォームを定義しています。

from django import forms

class MemberForm(forms.Form):
    first_name = forms.CharField(label= "名前")
    last_name = forms.CharField(label= "苗字")
    address = forms.CharField(label="住所")
    age = forms.IntegerField(label= "年齢")
    Mail = forms.EmailField(label="メールアドレス")

上記例ではMemberFormクラスを定義しています。
その中に各種フィールドを定義しています。

このフォームクラスで使うフィールドは多くの種類が用意されています。
上記例ではテキスト入力のためのCharField、整数値入力のためのIntegerField、メールアドレス入力のためのEmailFieldを使用しています。

forms.Formを利用するメリットである、細かな設定を行うにはフィールドの種類(型)や引数の使い方を身に着けておく必要があります。
フィールドや引数については以下記事で詳しく解説しています。

3.views.py:テンプレートにフォームクラスを渡す

views.pyでは、forms.pyで定義したフォームクラスを引き継いで、テンプレートにそのフォームクラスを渡す記述をします。

下記にそのコードを記します。

from django.shortcuts import render
from .forms import MemberForm

def index(request):
    form = MemberForm()
    context = {'form': form,}
    return render(request, 'five/index.html', context)

まずviews.pyの先頭でforms.pyからMemberFormをインポートします。

そして関数内でそのフォームクラスをインスタンス化します。
インスタンス化したフォームクラスを変数に入れて、render()メソッドを利用してテンプレートに渡しています。

4.テンプレート(HTMLファイル)にフォームを表示させる

テンプレート(HTMLファイル)にviews.pyから渡されたフォームクラスを利用して、フォームを表示します。

下記にフォーム部分を抜粋したテンプレートを記します。

<h2>会員登録フォーム</h2>
<form class="" action="" method="post" enctype="multipart/form-data">
    {% csrf_token %}
    {{ form.as_p }}
    <button type="submit" name="submit">Submit</button>
</form>

{{ form.as_p }}

{{ form.as_p }}によりフォームをテンプレートに表示しています。
formはインスタンス化したフォームクラスを入れた変数を指定します。

as_pとは、formの各要素(inputタグ)をpタグで囲むことを意味しています。

<p><label>名前:</label><input type="text"></p>

{% csrf_token %}

{% csrf_token %}はCSRF(クロスサイトリクエストフォージェリ)を検証する仕組みです。

Djangoのフォーム送信では、この記述がないとエラーになりますので、必ず記述するようにしましょう。

まとめ

本記事「【Django】フォームの作成:forms.pyにフォームクラスを定義する(forms.Form)」はいかがでしたか。

forms.Formを利用したフォームクラスの定義は、記述するコードの量が多いですがforms.ModelFormではできない細かな設定が可能です。

Djangoのフォームについて理解を深めて、納得のいくフォームが作成できるように頑張ってください。