前記事のようなやつ
Djangoでbitflyerの収支管理アプリを作ってみる（02_01.ログイン画面を作る。）
https://qiita.com/redmeteor777/items/1b974f15ac8b0e87a17d
ある程度記事数書き上げたらまとめる予定。
後記事へのリンクとか。
前記事の最後に生やした草を刈り取って、入力フィールドを埋めていきます。
まずloginディレクトリの中に、フォームを作成するためのファイル、[forms.py]を作成します。
そして、作成した[forms.py]に入力フォームについての関数を書いていきます。
from django import forms
class LoginForm(forms.Form):
user_id = forms.EmailField(
label='user_id',
max_length=30,
min_length=8,
required=True
)
password = forms.CharField(
label='password',
max_length=30,
min_length=8,
required=True
)
formsをimportして、入力フィールドを記述しました。
EmailFieldは「メールアドレス形式」のみ入力できるフィールドを作成します。
CharFieldは「テキスト形式」の入力が可能なフィールドを作成します。
ビュー関数の定義
次にビュー関数を定義します。
from django.shortcuts import render
from django.http import HttpResponse
from .forms import LoginForm
def login(request):
params = {
'title': 'Login_Form',
'message': 'input your e-mail and pass.',
'form': LoginForm()
}
if (request.method == 'POST'):
params['message'] = \
'メールアドレス：' + request.POST['user_id'] + \
'<br>パスワード：' + request.POST['password']
params['form'] = LoginForm(request.POST)
return render(request, 'bfmonitor/login.html', params)
def registration(request):
return HttpResponse("Hello, World!!!!!")
変更したのは以下の3点。
from .forms import LoginForm
直前に作ったLoginFormをimportします。
paramsの作成
テンプレートに渡す引数として使う、params変数が準備されています。
POSTが要求された場合の処理を記述しています。
GETが来てもPOSTが来てもそれぞれ処理をできるように、準備している感じですね。
HTMLファイルに変数を埋め込む！
前回草を生やしたファイルを編集しないと、今回も草が生えてしまいます。
というわけで、index.htmlを編集していきましょう。
{% load static %}
<!doctype html>
<html lang="ja">
<head>
<meta charset="uth-8">
<title>{{title}}</title>
{% comment %} <link rel="stylesheet" type="text/css"
href="{% static 'login/css/style.css' %}" /> {% endcomment %}
</head>
<body>
<h1>{{title}}</h1>
<p>{{message|safe}}</p>
<form action="{% url 'login' %}" method="post">
{% crsf_token %}
{{ form }}
<input type="submit" value="click">
</form>
</body>
</html>
草刈り完了です。
最後にurlpatternを修正しましょう。
urlpatterns = [
path('admin/', admin.site.urls),
path('login/', login.login, name='login'),
path('registration/', login.registration),
]
name='login'
と追記することで、きちんとページの中身を読み込みに行ってくれるはずです。
ではサーバーを起動して確認してみましょう。
>python manage.py runserver
ログイン画面にアクセスして表示を確認します。
http://localhost:8000/login/
入力フォームが表示されれば完成です！
お疲れ様でした！人類の勝利です！！
やっと画面1個できた！！！
…と言っても、入力用のフィールドが表示されるようになっただけです。
データを送ることもできないし、送ったデータを照合するデータベースもないです。
というわけで、次回はユーザー登録画面を作っていきます！
次回はtableタグとかつけて体裁を整えます！！！