Djangoでフォーム画面を作成します。
Djangoにおいてフォーム画面の作成には、「Formクラス」または「ModelFormクラス」を利用する場合の2つに分けられます。本記事ではModelFormクラスによる作成を説明します。
上記リンク先ページでは、「Formクラス」を継承したUserFormクラスを作成し、その中にnameやemailなどのフィールドを一つずつ記述していきました。しかし、あらかじめ「モデル(データベースにおけるテーブル)」が存在する場合は、「ModelFormクラス」を利用するとフォーム画面が構築しやすくなります。
SQLiteの利用(マイグレーション等)やモデル(models.py)自体がわからない場合は、下記の関連ページをご覧下さい。
本記事ではuserという名前のアプリケーションを作成し、また下記のようにnewとlistのテンプレート(内容は後述)を用意してある前提で話を進めます。
1 2 3 4 5 |
└── user ├── templates └── user ├── list.html └── new.html |
アプリケーション概要
これから下記のMemberモデルによるテーブルに登録できるフォーム画面を作成していきます。
user/models.py
1 2 3 4 5 6 7 8 9 |
from django.db import models class Member(models.Model): name = models.CharField(max_length=100) age = models.IntegerField(default=0) def __str__(self): return self.name |
画面遷移の様子は下記のようになります。フィールドが未入力だと「このフィールドは必須です。」というエラーメッセージが表示されます。登録完了すると、user/list画面に遷移し一覧表が表示されます。
ModelForm
userディレクトリ内にforms.pyを作成し下記のように記述します。ModelFormクラスを継承したUserFormクラスを作成しています。
user/forms.py
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
from django import forms from .models import Member class UserForm(forms.ModelForm): class Meta: model = Member fields = ('name', 'age') labels = { 'name': '名前', 'age': '年齢' } help_texts = { 'name': '名前を入力', 'age': '年齢を入力' } |
8行目
画面に表示させるフィールドを指定しています。下記のように指定すると、作成したモデルのすべてのフィールドを取得できます。
1 |
fields = '__all__' |
次にビュー関数を作成します。
user/views.py
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
from django.shortcuts import render, redirect from .forms import UserForm from .models import Member def new(request): params = {'message': '', 'form': None} if request.method == 'POST': form = UserForm(request.POST) if form.is_valid(): form.save() return redirect('list') else: params['message'] = '再入力して下さい' params['form'] = form else: params['form'] = UserForm() return render(request, 'user/new.html', params) def list(request): data = Member.objects.all() params = {'message': 'メンバーの一覧', 'data': data} return render(request, 'user/list.html', params) |
10行目
is_valid()メソッドでMemberモデルのバリデーションが実行されます。問題ない場合はsave()メソッドでデータが保存され、user/listへリダイレクトされます。listの画面については上述した関連ページにて説明しています。
15行目
各フィールドのエラーメッセージ(「このフィールドは必須です。」等)をテンプレートに表示させるためのformインスタンスを渡しています。
テンプレートを下記のように編集します。
user/templates/user/new.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>フォーム</title> </head> <body> <h1>メンバー登録フォーム</h1> <form method="POST" novalidate> {% csrf_token %} {{ form.as_p }} <button type="submit">送信</button> </form> <p>{{ message }}</p> </body> </html> |
11行目
novalidateで、ブラウザ自体のバリデーション機能を無効にしています。
リダイレクト先のテンプレートです。
user/templates/user/list.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Member表</title> </head> <body> <h1>Memberモデル</h1> <p>{{ message }}</p> <table border="1"> <tr> <th>name</th> <th>age</th> </tr> {% for member in data %} <tr> <td>{{ member.name }}</td> <td>{{ member.age }}</td> </tr> {% endfor %} </table> </body> </html> |
userディレクトリ内にurls.pyを作成し、下記のように編集します。
user/urls.py
1 2 3 4 5 6 7 |
from django.urls import path from . import views urlpatterns = [ path('new/', views.new, name='new'), path('list/', views.list, name='list'), ] |
本記事ではバリデーションの細かい説明をしませんでしたが、下記関連ページもご覧下さい。
参照ページ
django ドキュメント
モデルからフォームを作成する