こんにちは！Masaです。
今日はタスク管理アプリ開発の続きをやっていきます！
- タスク管理アプリの作成方法
- 基本的なDjangoによるアプリ作成
前回までのおさらい
２回目までに以下のことを行いました。
- models.pyやview.py、templateを作成し、画面表示できるようにしました。
- 管理者画面からタスクを追加して、ブラウザ画面に表示することができました。
↓前回の記事
今回はフォームを作成し、アプリケーション上でタスクの登録を行えるようにしていきます。
forms.pyの作成
まず、”forms.py“というファイルをアプリケーションフォルダ（to_do_list）に作成してください。
forms.pyの使用用途としては、一般的に
- 問い合わせ
- webページからの入力や選択
- 会員登録
などに使用します。
今回はタスクの追加に使用します。
forms.pyを作成したら、コードを記述していきましょう。
自分は以下のように記述しました。
from django import forms
from .models import(
To_do,
)
class To_doForm(forms.ModelForm):
class Meta:
model = To_do
fields = (
'deadline',
'task',
)
widgets = {
'deadline': forms.NumberInput(attrs={
"type": "date",
})
}
def __init__(self, *args, **kwargs):
super().__init__(*args, **kwargs)
for field in self.fields.values():
field.widget.attrs['class'] = 'form-control'forms.pyについて解説していきます。
- (１行目)モデルを利用したフォームクラスは、django.forms.ModelFormのサブクラスとして定義します。そのため、django.formsをインポートします。
- (7行目)モデルを使用したフォームクラスを作成するため、django.forms.ModelFormを継承します
- 使用するモデルを選択し（9行目）、使用するモデルフィールドを選択します（10行目以降）
- 14行目以降のwidgetsはテンプレート上での見た目を指定したものとなります。詳しくは以下の記事を参考にしてください。
- (20行目以降)この部分はフォームにBootstrapを適用しています。
モデルフォームを基本的な型は以下のような形です。
参考にしてください。
from django import forms
from .models import モデル名
class フォーム名(forms.ModelForm):
class Meta:
model = モデル名
fields = (
'フィールド１',
'フィールド２'
)これでforms.pyの作成は終了です。
views.pyでフォームをテンプレートに渡す（おさらい）
※以下、先に実装済みですが、おさらいのため軽く解説します。
forms.pyを作成したら、次は作成したフォームクラスをテンプレートに渡します。
以下views.pyの一部抜粋部分にフォームが関係している場所をコメントしてあります。
from django.shortcuts import redirect
from django.views import generic
import datetime
from .models import To_do
from .forms import To_doForm #フォームをインポート
today = datetime.datetime.today().date()
class IndexView(generic.TemplateView):
template_name = 'to_do_list/index.html'
def get_context_data(self, **kwargs):
incomplete_task = To_do.objects.filter(states="2", deadline__gt=today).all().order_by('deadline')
after_deadline_task = To_do.objects.filter(states="2", deadline__lte=today).all().order_by('deadline')
context = super().get_context_data(**kwargs)
context["today"] = today
context["complete_task"] = To_do.objects.filter(states="1").all().order_by('deadline')
context["incomplete_task"] = incomplete_task
context["after_deadline_task"] = after_deadline_task
context["form"] = To_doForm() #フォームをcontextに格納し、テンプレートに渡す
return context
フォームをテンプレートで表示する（おさらい）
※以下、先に実装済みですが、おさらいのため軽く解説します。
テンプレートにフォームを配置することで、アプリケーションでフォーム入力が可能となります。
以下、”index.html”のフォーム部分を抜粋しています。
form method="POST" enctype='multipart/form-data'>
{% csrf_token %}
<table class="table">
{{ form.as_table }}
</table>
<div class="d-grid gap-2">
<button class="btn btn-outline-primary" type="submit">作成</button>
</div>
</form>- {% csrf_token %}はCSRFを検証するためのものであり、かならず記述しなくてはいけません。
- {{ form.as_table }}でTo_DoFormが渡されました。
- ”.as_table”はテーブル形式で表示と指定しています。
これで一通りコンポーネントを配置することができました。
ここで開発用サーバを起動してみましょう。
それなりにアプリケーションぽくなったんではないでしょうか。
最後にフォームでタスクを登録された時の処理であるPOSTの処理とタスクの状態を変更したときの処理について簡単に解説します。
POSTとタスク状態変更時の処理
まずはPOSTの処理についてです。
POSTとはクライアントからデータを送信するための処理で、今回は新規のタスクをサーバに送信しています。
以下、POST時の処理を抜粋します。
def post(self, request):
to_do = To_do()
to_do_form = To_doForm(request.POST, instance=to_do)
to_do_form.save()
return redirect(to='/')これはDjangoの基本的なPOST処理です。
これはかなりの頻度で使用するため、この形を覚えてしまった方が良いと思います。
次にタスク状態変更時の処理です。
これは「完了」ボタンをクリックすると「完了タスク」に移動する等の処理です
この部分を抜粋したものが以下になります。
タスク状態変更時の処理
def Condition(self, num):
task = To_do.objects.get(id=num)
if task.states == "1":
task.states = "2"
task.save()
else:
task.states = "1"
task.save()
return redirect(to='/')
モデル”To_Do”は”states”というフィールドがあり、これは”item”から選択するようになっています。
itemは完了か未完了を持っているので、ボタンが押されたら状態を逆にする処理をしています。
statesでフィルタリングすることで、タスクの完了/未完了を分けています。
まとめ
今回はforms.pyを使ってタスクの追加を行いました。
現在のままだと登録したタスクの名前や期限を変更やタスクの削除ができません。
少し使い勝手が悪いので、次回は削除と変更を行えるようにしたいと思います。
↓次回の記事
コメント