クラスベースビューであるUpdateView(編集するためのビュー)を利用して、編集画面を作成してみます。
下記関連ページでは新規作成画面を作成しましたが、本記事では引き続き編集画面を作成します。
関連ページ
UpdateViewはオブジェクトの編集画面の描画およびバリデーションエラー表示の機能を持つクラスです。オブジェクトとはモデルのデータであり、本記事では下記のMemberモデルを利用しています。アプリケーション名はuserで構築しています。
user/models.py
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
from django.db import models from django.core.validators import MinLengthValidator, RegexValidator from django.core.exceptions import ValidationError def check_age(value): if value < 10 or value > 100: raise ValidationError('10〜100歳が範囲ですよ!') class Member(models.Model): name = models.CharField(max_length=100) nickname = models.CharField(max_length=100, validators=[MinLengthValidator(5, '5文字以上です!'), RegexValidator(r'^[a-zA-Z0-9]*$', '英数字のみです!')]) age = models.IntegerField( default=0, validators=[check_age]) def __str__(self): return self.name |
以下コードと説明です。
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 25 26 27 28 29 30 31 32 33 34 35 36 37 |
from django.shortcuts import render from .models import Member from django.views.generic import ListView, DetailView, CreateView, UpdateView from django.urls import reverse class MemberList(ListView): model = Member class MemberDetail(DetailView): model = Member class MemberCreate(CreateView): # template_name = 'user/member_form.html' model = Member fields = ['name', 'nickname', 'age'] def get_success_url(self): return reverse('detail', kwargs={'pk': self.object.pk}) class MemberUpdate(UpdateView): template_name = 'user/member_update_form.html' model = Member fields = ['name', 'nickname', 'age'] def get_success_url(self): return reverse('detail', kwargs={'pk': self.object.pk}) def get_form(self): form = super(MemberUpdate, self).get_form() form.fields['name'].label = '名前' form.fields['nickname'].label = 'ニックネーム' form.fields['age'].label = '年齢' return form |
「編集するためのビュー」であるCreateViewとほぼ同じ記述です。登録完了すると詳細画面へ遷移するようにしています。
25行目
template_nameに利用するテンプレートを指定しています。デフォルトではCreateViewでのテンプレートと同じ「アプリ名/モデル名_form.html」が設定されているので、本記事では別のテンプレートを用意しておきました。
user/urls.py
1 2 3 4 5 6 7 8 9 |
from django.urls import path from . import views urlpatterns = [ path('', views.MemberList.as_view(), name='member'), path('<int:pk>/', views.MemberDetail.as_view(), name='detail'), path('create/', views.MemberCreate.as_view(), name='create'), path('<int:pk>/update/', views.MemberUpdate.as_view(), name='update'), ] |
8行目
<int:pk>は、URLに「user/1/update/」のようにアクセスする場合の記述で、intは整数値での指定を表します。pkはDjangoに備わった照合形式で、主キー(PRIMARY KEY)を表します。
user/templates/user/member_update_form.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>UpdateViewサンプル</title> </head> <body> <h1>UpdateView編集画面</h1> <form method="post" novalidate> {% csrf_token %} {{ form.as_p }} <input type="submit" value="保存"> </form> </body> </html> |
user/templates/user/member_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 27 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>ListViewサンプル</title> </head> <body> <h1>ListView一覧画面</h1> <table border="1"> <tr> <th>name</th> <th>詳細</th> <th>編集</th> </tr> {% for member in object_list %} <tr> <td>{{ member.name }}</td> <th><a href="{% url 'detail' member.pk %}">詳細</a></th> <th><a href="{% url 'update' member.pk %}">編集</a></th> </tr> {% endfor %} </table> </body> </html> |
21行目
「update」は、urls.pyのpathの第3引数のnameで指定した名前です。member.pkのpkは上述したようにモデルの主キーを表し、本記事では自動的に生成されたidカラムのことを指すようになります。つまりidの整数値によってデータベースに対して照合されるようになります。
member_list.html の表示画面
関連ページ
参照ページ
django ドキュメント
Generic editing ビュー UpdateView