Djangoを勉強してみる_フォームを学ぶ_その3(入門編)

django-339744_640.png

前回の続きで、Djangoについて学んでいきます。

今回も引き続きフォームについて勉強していきます。

Djangoの勉強内容は以下の本を参考にしています。

参考

Python Django3超入門 (日本語) 単行本 – 2020/6/13 掌田 津耶乃 (著)

フォームを使う

コードは以前の記事を参考にしてください。

Djangoを勉強してみる(入門編)

Djangoを勉強してみる(入門編その2)

Djangoを勉強してみる_urlを学ぶ(入門編)

Djangoを勉強してみる_テンプレートを学ぶ(入門編)

Djangoを勉強してみる_テンプレートを学ぶ_その2(入門編)

Djangoを勉強してみる_フォームを学ぶ_その1(入門編)

Djangoを勉強してみる_フォームを学ぶ_その2(入門編)

色々なFormのフィールドを使ってみる

今回はCharFieldとIntegerField以外に次のフィールドを使ってみます。

・チェックボックス
・プルダウンメニュー

まずは、チェックボックスから作ってみます。

チェックボックスを作る

1.forms.pyを新規作成

ファイル:sample_app>hello>forms.py

コード:

from django import forms

class HelloForm(forms.Form):
    check = forms.BooleanField(label='チェックボックス', required=False) #追加

チェックボックスを利用する場合は、BooleanFieldを使います。

requiredをFalseをにしているのには理由があります。

それは、Trueにしているとチェックボックスにチェックが入っていない場合、値が入っていないためエラーが発生しデータを送信できません。

また、requiredが無い場合も同様に、チェックボックスにチェックが無い場合も値が無いと判断してデータを送信できません。

そのため、「BooleanField」を利用するときは「required=False」をっ呈する必要があります。

2.views.pyを修正する

続いては先ほど作成したフォームを利用するために、views.pyを修正します。

ファイル:sample_app>hello>views.py

コード:

from django.shortcuts import render
from django.http import HttpResponse
from .forms import HelloForm

def index(request):
    params = {
        'title': 'Hello World!!',
        'msg': 'これはサンプルページです。',
        'form': HelloForm(),
        'check_result':None #追加
    }
    if (request.method == 'POST'):
#ここから追加---- if('check' in request.POST): params['check_result'] = 'チェックが入ってます。' params['form'] = HelloForm(request.POST) else: params['check_result'] = 'チェックが入っていません。'
#ここまで---- return render(request, 'hello/index.html', params)

ここでは、条件文を使って送信されたPOSTにチェックが入っていた場合「チェックが入ってます。」を「check_result」変数に代入し、入っていなかった場合「チェックが入っていません。」と表示させています。

3.index.htmlを修正する

最後にチェックボックスをテンプレートに表示させます。

ファイル:sample_app>hello>templates>hello>index.html

コード:

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>{{ title }}</title>
</head>
<body>
    <h1>{{ title }}</h1>
    <p>{{ check_result | safe }}</p> #追加
    <form action="{% url 'index' %}" method="post">
        {% csrf_token %}
        {{ form.as_p }}
        <input type = "submit" value="click">
    </form>
    <a href ="{% url 'index' %}">INDEXへ</a>
</body>
</html>

チェックボックスの結果を表示させるため、「{{ check_result | safe }}」を追加しました。

以上で設定が終わったので、動作確認してみます。

動作確認

python manage.py runserver

ブラウザで以下にアクセスします。

http://localhost:8000/hello

チェックボックスにチェックを入れてクリックします。

次にチェック無しでクリックします。

 

以上で、チェックボックスは終わりです。

続いて、プルダウンメニューを作ってみます。

プルダウンメニューを作る

プルダウンメニューを作る場合は、「ChoiceField」というクラスを使います。

1.forms.pyを新規作成

ファイル:sample_app>hello>forms.py

コード:

from django import forms

class HelloForm(forms.Form):
    data=[
        ('サンプル1', '1'),
        ('サンプル2', '2'),
        ('サンプル3', '3'),
    ]
    choice = forms.ChoiceField(label='プルダウンメニュー',choices=data)

プルダウンメニューを作る場合は、事前にデータを作成して、ChoiceFieldでデータを渡します。

2.views.pyを修正する

続いては先ほど作成したフォームを利用するために、views.pyを修正します。

ファイル:sample_app>hello>views.py

コード:

from django.shortcuts import render
from django.http import HttpResponse
from .forms import HelloForm

def index(request):
    params = {
        'title': 'Hello World!!',
        'msg': 'これはサンプルページです。',
        'form': HelloForm(),
        'check_result':None
    }
    if (request.method == 'POST'):
        if('choice' in request.POST):
            ch = request.POST['choice']
            params['check_result'] = '選択した値は' + ch + 'です。'
            params['form'] = HelloForm(request.POST)

以上で設定は終わりです。結果は以下のようになります。

1を選択してクリックした時の画像です。

ちなみに、forms.pyのChoiceFieldの引数に「widge=forms.RaidoSelect」を設定すると、ラジオボタンにすることもできます。

choice = forms.ChoiceField(label='Choice', choices=data,widget=forms.RadioSelect())

これで今回の目的である色々なフォームのフィールドを使うことができました。

次回はモデルを勉強していこうと思います。

以上です。ありがとうございました。

P.S.

勉強を継続することが苦手ですか?

少し前からココナラというサービスで習慣化のテクニックについて教えるサービスを始めました。

もし、いつも3日坊主で終わってしまうという方や、ダイエットを続けたい、勉強したい、運動したいなど何か習慣化したいと思っている方がいましたら全力でサポートしますので、まずは覗いてみてください。

すでに何人かの方に実践してもらって効果が出ているという感想をいただいてます。

人生変わる?【習慣化の方法】を教えます 【残り1名】ダイエット、勉強、運動を続けることが苦手ですか?

 

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

30歳未経験からネットワークエンジニアに転職し、運用→構築→設計の仕事をやってます。色んな機器(Cisco、YAMAHA、Fortigate、PaloAlto)を触らせてもらいとても楽しい仕事です!

現在は派遣にて主にCiscoを中心としたネットワーク設計~構築をしております。

また、2023年より副業で個人事業主や小規模企業からのパソコン設定~ネットワーク作業の仕事を請け負っておりますので、もしお困りの方がいましたらお気軽にお問い合わせください。

●今までの作業履歴
- パソコンの新旧入れ替え
- 拠点間のインターネットVPN接続(YAMAHA-Fortigate)

コメント

コメントする

目次