6
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

python,djangoによるいいねボタンの作り方

Posted at

いいねボタンを作ります。
ボタンを押すと数字が1つずつ増えていくやつです。
僕が実際にwebアプリケーションで使用しているのがこちら。


def good(request, pk):
    """いいねボタンをクリック."""
    post = get_object_or_404(Post, pk=pk)

    if request.method == 'POST':
        # データの新規追加
        post.good += 1
        post.save()

    return redirect('board:board')

では解説を。


Postモデルとプライマリーキーをpostという変数に代入します。

post = get_object_or_404(Post, pk=pk)

もしurlへのアクセスがPOSTならばということなのでフォームで送信された場合ということができますね。 直接URLにアクセスした場合やGETとは違うということです。
    if request.method == 'POST':

        post.good += 1
        post.save()

変数postの中身にモデルPOSTが含まれています。
.goodという形で記載するとmodels.pyのPOSTモデルにあるgoodフィールドにアクセスできます。
+= 1は1増やすという書き方です。
pythonの基礎の方でfor文を使ってループをさせるときにループするたびに数値を増やしていくというようなときは

= 1

という代入の仕方ではなく

+= 1

という代入を使います。
厳密に書くと以下のような意味なのですが、

post.good = post.good + 1

pythonでは += 1と書くと同様の効果が得られるのです。

post.save()

で数値を保存します。


リダイレクト先の指定。

return redirect('board:board')

html部分を解説。
    <form action="{% url 'board:good' post.pk %}" method="post">
        {% csrf_token %}
        <input type="submit" name="good" value="いいね" id="test">({{ post.good }} いいね)<p  style="color:red"><font size="1"><strong>押すと1ページ目まで戻ってしまいます!(いつか直す!)</strong></font></p>
    </form>

いいねボタンを押すと'board:good' post.pk に処理をします。

action="{% url 'board:good' post.pk %}

board:goodのurls.pyはこのようになっています。

path('good/<int:pk>', views.good, name='good'),

good関数が使用できるurlにアクセスすると数字を1増やすことができます。ただしboard:goodにはその他の機能を何も持たせていないのでredirectで元のurlに戻しているんですね。
そうするとボタンを押すと一瞬画面が切り替わり次の瞬間には数字が1だけ増えている。
という現象が完成するのです。



余談ですがJavaScriptを使用しないといいねボタンを押す度にページの一番上に戻ってしまうんですよね。 JavaScriptを勉強してページが遷移しないように改修しようと思っています。
6
12
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?