Настроить ajax для чекбоксов в Django?

Question

[Влад Ильницкий]

Есть список задач (tasks), которые выводятся на главной, и каждое характеризуется состоянием "выполнено\не выполнено".
Задача: настроить ajax-автообновление, чтобы при клике по чекбоксу менялось состояние таска и заносилось в БД.

home.html

{% extends "base.html" %}
{% for task in tasks %}
        <div class="task-box">
         <input type="checkbox" data-task-id="{{ task.id }}" {% if task.checkbox == True %} checked="1"{% endif %}/>
         {% if task.checkbox == True %}<del>{{ task.name }}</del><hr>
         {% else %} {{ task.name }}<hr>
         {% endif %}
        </div>
    {% endfor %}

main.js

function initJournal() {
 $('.task-box input[type="checkbox"]').click(function (event) {
  var box = $(this);
  var myurl = "/home/";
  $.ajax({
   type: 'POST',
   async: true,
   dataType: 'json',
   url: myurl,
   data: {
    'pk': box.data('task-id')
   },
   error: function (xhr, status, error) {
    alert(error);
   },
   success: function (data, status, xhr) {
    alert(data['key']);
   }
  });
 });
}

 $(document).ready(function(){
 initJournal();
 });

views.py

class ....
 def post(self, request, *args, **kwargs):
        #turn super(TaskCreateView, self).post(request, *args, **kwargs)
        data = request.POST
        task = Task.objects.get(pk=data['pk'])
        task.checkbox = True
        task.save()
        return JsonResponse({'status': 'success'})

Но почему-то это не работает, и при клике по чекбоксу выводится алерт "Not Found"
Буду благодарен за любую помощь, перепробовал уже кучу разных вариантов, ничего не работает.

Answer 1

[Дмитрий Воронков]

Ну во первых:

...
'pk': box.attr('data-task-id')
...

Это чтоб находил нужную таску.
Но теперь будет выпадать ошибка 403, для этого нужно:
in views.py

from django.views.decorators.csrf import csrf_exempt
class Any(FormView):
...

any = csrf_exempt(Any.as_view())

Comments

[Сергей Горностаев]

Лучше доработать js-код для поддержки csrf.