htmlに書くformの仕組みを分かりやすく解説【基本が大切です】

djangoの勉強を進めていく中で、htmlの中にと書かれているのを見たことがあるでしょうか？

これを書くだけでformの内容が表示されるので非常に便利である反面、なぜformと書くだけで複雑なコードが表示されるのかよくわからない。

という方も多いかもしれません。

そこで今回は、djangoにおけるformの仕組みについて分かりやすく解説していきます。
formとは、Formクラスから作られたオブジェクトである

結論からお伝えすると、formはFormクラスから作られたオブジェクトのことです。

ここから、中身について少しずつひもといていきましょう。
Formクラスの復習

まずは簡単にFormクラスの復習をしましょう。Formクラスは、Modelと同じようなイメージで、formとして使うフィールドを定義するために使われます。

具体的なコードでみていきましょう。


[コード]

-BASE/app/forms.py
from django import forms
class SampleForm(forms.Form):
    title = forms.CharField(max_length=50)

SampleFormというクラスを定義し、そのなかでtitleというフィールドを作りました。

モデルと同じようなイメージで使えるということが分かるかと思います。
formの中身を確認する

次に、formの中身を確認していきましょう。

理解を深めるために、まずはformではなくabcdという名前でオブジェクトを作ってみます。


[コード]

-BASE/app/views.py
def appfunction(request):
    abcd = SampleForm()
    print(abcd)
    return HttpResponse('')

コンソールに何が出力されているかを見てみましょう。


[コマンドライン]

<tr><th><label for="id_title">Title:</label></th><td><input type="text" name="title" maxlength="50" required id="id_title"></td></tr>
<tr><th><label for="id_number">Number:</label></th><td><input type="number" name="number" required id="id_number"></td></tr>

このコードはまさにformの内容です。つまり、SampleForm()からオブジェクトを作ると、それがフォームの内容になるのです。

class based viewの場合、form属性にはフォームの内容が入っている

先ほど、abcdという名前でformオブジェクトを作りましたが、初期設定ではformという名前になっています。

ですので、class based viewの場合はformという名前を使うだけで、formの内容を表示することができるようになるのです。

function based viewの場合、contextを設定すればフォームとして使えます

次に、function based viewの場合におけるフォームの使い方をみていきましょう。

具体的にはcontextを使うのですが、コードを見た方が分かりやすいと思いますので、実際のコードをみていきましょう。


[コード]

-BASE/app/views.py
def appfunction(request):
    abcd = SampleForm()
    return render(request, 'form.html', {'form': abcd})

このように、renderメソッドの中でformを定義することで、function based viewの場合でもformという名前で、お問い合わせのフォームを使うことができるようになります。

～Django無料講義～のご案内

Code for Djangoが、4時間超の無料Django講義をはじめました
　
・本を出版したCode for Djangoの
　製作者が作ったサイトです。
　
・Code for Djangoの内容も、
　動画で詳しく解説しています。
　
・動画は順次ふやしていきますので、
　ただで学び続けることが可能です。
　
・Djangoの効率的なスキルアップに、
　是非お役立て下さい。

                                                                 Django講義はこちら

運営会社  株式会社CODOR

神奈川県平塚市紅谷町8-16
https://codor.co.jp
会員の方のログインはこちら
特徴
サービス
実績
お問い合わせ
  • 講座に関するお問い合わせ
  • AI導入に関するお問い合わせ

個人情報保護方針

© 2024  CODOR Inc.
Created with