更新 Django 对象字段而不刷新页面

Question

如何调用视图函数来更改对象字段而不刷新页面？

views.py

def add_like(request, pk):
    book = Book.objects.get(pk=pk)
    book.like = True
    book.save()
    return redirect('book_list')

urls.py

url(r'^add_like/(?P<pk>[0-9]+)/$', views.add_like, name='add_like'),

list.html

[...]
<td><a href="{% url 'add_like' pk=book.pk %}" class="btn btn-default"><span class="glyphicon glyphicon-heart" style="color: grey;"></span></a></td>
[...]

一旦用户单击按钮，我想将状态和标签内容更改为：

<td><a href="{% url 'remove_like' pk=book.pk %}" class="btn btn-default"><span class="glyphicon glyphicon-heart" style="color: red;"></span></a></td>

我知道 Ajax 可以是答案，但我不知道如何实现它。

谢谢。

Answer 1

代替

<td><a href="{% url 'remove_like' pk=book.pk %}" class="btn btn-default"><span class="glyphicon glyphicon-heart" style="color: red;"></span></a></td>

使用输入并给它一个 ID，如

<td><input style="color: red" class="book btn btn-default glyphicon glyphicon-heart" value="{book.pk}" /></td>

然后根据with this example调用AJAX函数

  <script>
    $(".book").on('click', function () {
      var id = $(this).val();

      $.ajax({
        url: '/add_like/',
        data: {
          'pk': id
        },
        dataType: 'json',
        success: function (data) {
          if (data) {
            alert(data);
          }
        }
      });

    });
  </script>

然后更新您的视图：

from django.http import JsonResponse
def add_like(request):
    pk = request.GET.get('pk', None)
    book = Book.objects.get(pk=pk)
    book.like = True
    book.save()
    data = {'book', book}
    return JsonResponse('data')