まず初めに
皆さんこんにちは!
今回はPythonに関する記事の第2弾です。
前回に引き続きDjangoというフレームワークを使用する上で役立つであろう内容を書いていけたらなと思います。
今回のテーマはずばり「テンプレート上での配列の特殊な扱い方」です!
テンプレートとはDjango上でアプリケーションの「templates」フォルダ内に格納されるレイアウト情報が記載されているHTMLファイルの事を指しています。
そのHTMLファイル上で配列を特殊な感じで操作するための記載の方法をご紹介していきたいと思います。
・Djangoを使用したシステム開発を行う予定・すでに行っている方
・Django上でデータベースデータを扱おうとしている方
基本的な配列の使い方
まずは基本の振り返り
まずは基本的な使い方のおさらいです。
まず前提として、view.py側で取得したテーブル情報を「movies」という変数に配列として取得しているとします。
ちなみにview.py側の記載を書いておくと以下のような感じです。
//index.htmlというテンプレートにmovies変数を渡す。
class IndexListView(generic.ListView):
model = Movie
template_name = 'index.html'
def get_queryset(self):
movies = Movie.objects.all()
return movies
簡単に言うと映画のタイトルの一覧が入っているような配列をイメージしてもらえるとOKです。
これをテンプレートに受け取って何に使うのでしょうか。
一覧ですので、大抵の場合はループ処理をして、配列の要素を順番に表示したりするケースが多いはずです。
その際には以下のような書き方をします。
{% for movie in movie_list %}
<p>{{ movie .title }}</p>
{% empty %}
<p>一覧なし</p>
{% endfor %}
for文で配列から要素を一つずつ抜き出して、「要素名.項目名」の形式で表示することができますね。※ここでいう「movie.title」
以上、基本的な使い方の復習でした。
実際にやってみましょう(モデル作成編)
ここからは実際に手を動かして、上記配列でのループ処理の確認をしていきましょう。
確認には、以下の記事で作成した簡易的なテストプロジェクト「TestApp」を使用していきます。
まだ試せる環境を自身では持っていないという方は、参考にしてぜひ一緒に試してみてくださいね。
まずはリストに表示させる情報元として、Movie情報のテーブルを作成していきましょう。
Djangoにおいて、テーブルをデータベースに追加したい場合、「models.py」というファイルを変更する必要があります。
from django.db import models
# Create your models here.
# Movieモデルの追加
class Movie(models.Model):
"""Movie用のモデル"""
title = models.CharField(verbose_name='タイトル', max_length=40)
content = models.TextField(verbose_name='内容', blank=True, null=True)
create_dt = models.DateTimeField(verbose_name='登録日', auto_now_add=True)
update_dt = models.DateTimeField(verbose_name='更新日', auto_now=True)
class Meta:
verbose_name_plural = 'movie'
def __str__(self):
return self.title
python manage.py makemigrations testPage
python manage.py migrate testPage
モデルの追加・変更を行う際にはここまでCommand Lineで実行してきたコマンドを繰り返し実行していくことになります。
基本的にペアで実行するものと思ってもらっておいても良いかと思います。
python manage.py runserver
from django.contrib import admin
# 管理画面に反映させたいModelのインポート
from .models import Movie
# Register your models here.
# 管理画面にModelの反映を登録
admin.site.register(Movie)
実際にやってみましょう(ページ追加編)
モデルの作成ができたので、次にその情報をリスト形式で表示させてみましょう。
リスト形式で表示させるために、専用のページを追加していきます。Djangoにおいて、ページを追加するためには、以下の作業が必要になります。
① テンプレートファイルの追加
② views.pyへの明細追加
③ urls.pyへの明細追加
まずは1つめの「テンプレートファイルの追加」です。ここでは実際にWebページとして表示させるためのHTMLファイルを作成します。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>シンプルなMovie一覧</title>
</head>
<body>
<h1>Movieの一覧です</h1>
{% for movie in movie_list %}
<p>{{ movie.title }}</p>
{% empty %}
<p>一覧なし</p>
{% endfor %}
</body>
</html>
実際のシステム開発においてはCSSやJavaScriptで修飾が施されたもっと複雑な構成のHTMLファイルであることが大半です。
しかし、どのような構成のHTMLファイルであっても今回試しているようにループ処理でのリスト表示を組み込むことは可能なので、基本が大事ですね。
次に行うのは「views.pyへの明細追加」です。振り返りになりますが、views.pyはurls.pyにおけるルーティングとテンプレートファイルの橋渡しをするための設定ファイルです。どのルーティング設定に対し、どのテンプレートファイルを呼び出すのかを設定していきましょう。
# index.htmlというテンプレートにmovies変数を渡す。
class IndexListView(generic.ListView):
model = Movie
template_name = 'index.html'
def get_queryset(self):
movies = Movie.objects.all()
return movies
コードを見ると「generic.ListView」というものを引用していることがわかりますね。djangoにはそれ以外にもWebページのレイアウト構成に役立つ基礎的なViewが用意されています。ページの目的に合わせたViewを引用することで、効率よく開発ができることでしょう。
最後に「urls.pyへの明細追加」を行っていきましょう。
from django.urls import path
from . import views
urlpatterns = [
# 追加ページ用設定
path('', views.TestPageView.as_view(), name="testpage"),
# 一覧ページへのルーティング追加
path('index/', views.IndexListView.as_view(), name="listpage"),
]
すべての設定が完了しましたので、保存できましたら実際にページを見てみましょう!
ページには先ほどお伝えしたとおり「http://127.0.0.1:8000/index/」のアドレスでブラウザからアクセスできます。
※サーバの起動ができているか確認してくださいね。
特定のインデックスを指定して要素を抜き出し
知らないと意外とハマるけれど、わかるとシンプル
では次に順番に抜き出すのではなく、特定のインデックス番号の特定の項目だけ表示させたい場合にはどのようにしたら良いでしょうか。
ここでは例として「3番目の要素のtitle項目」を抜き出してみましょう。
答えから書きますと以下のような書き方で実現できます。
<p>{{ movie_list.2.title }}</p>
「配列.要素のインデックス番号.項目名」といった書き方をします。
3番目なので、インデックス番号表記をすると2となるのでご注意ください。
また、pythonファイル上で配列を扱う場合と違い、インデックス番号を「(2)」のように囲う必要もありません。
カンマ区切りでインデックス番号と項目名を指定するだけでOKです。
機械的に一覧表示するだけでなく、任意の項目の表示方法を知っておけば実装の幅が広がりますよね。
実際にやってみましょう
確認のために再び実際に手を動かしていきます。
さきほど作成したindex.pyに上記のように特定の要素を固定表示させるための記載を追加します。
<p>{{ movie_list.2.title }}</p>
<p>{{ movie_list.2.content }}</p>
まとめ
いかがだったでしょうか?
本日お伝えしたかった内容を簡単にまとめると以下のようになります。
ぜひ何らかの形でお役に立てれば幸いです。
それでは次の記事でまたお会いしましょう♪
・配列.要素のインデックス番号.項目名の形式でHTML上で配列の任意の項目を表示できます。