Обновление поля ManyToManyField путем вызова представления через ajax (кнопка "Like")

Не уверен, что это больше вопрос по javascript или по django, поэтому прошу простить меня, если это не в том месте. Я пытаюсь обновить поле ManyToMany, представляющее "лайки" на изображении, вызывая представление через ajax. Часть "нравится" работает, часть "не нравится" - нет.

У меня есть модель Image с полем users_like:

class Image(models.Model):
    user = models.ForeignKey(settings.AUTH_USER_MODEL, related_name = 'images_created', on_delete=models.CASCADE)
    users_like = models.ManyToManyField(settings.AUTH_USER_MODEL, related_name="images_liked", blank = True)
    # etc

Вид:

def image_like(request):
    image_id = request.POST.get('id')
    action = request.POST.get('action')
    if image_id and action:
        try:
            image = Image.objects.get(id = image_id)
            if action == 'like':
                image.users_like.add(request.user)
            else:
                images.users_like.remove(request.user)
            return JsonResponse({'status': 'ok'})
        except:
            pass
    return JsonResponse({'status': 'ko'})

Url:

path('like/', views.image_like, name = 'like'),

html/js:

<a href="#" data-id="{{ image.id }}" data-action="{% if request.user in users_like %}un{% endif %}like" class="like button">
   {% if request.user not in users_like %}
       Like
   {% else %}
      Unlike
   {% endif %}
 </a>
<!-- other html, skipping down to the jQuery-->

{% block domready %}
  $('a.like').click(function(e){
    e.preventDefault();
    $.post('{% url "images:like" %}',
      {
        id: $(this).data('id'),
        action: $(this).data('action')
      },
      function(data){
        if (data['status'] == 'ok')
        {
          var previous_action = $('a.like').data('action');

          // toggle data-action
          $('a.like').data('action', previous_action == 'like' ? 'unlike' : 'like');
          // toggle link text
          $('a.like').text(previous_action == 'like' ? 'Unlike' : 'Like');

          // update total likes
          var previous_likes = parseInt($('span.count .total').text());
          $('span.count .total').text(previous_action == 'like' ? previous_likes + 1 : previous_likes - 1);
        }
      }
    );
  });
{% endblock %}

Этот код успешно позволяет пользователю "понравиться" сообщению, и ссылка впоследствии изменяется на <a href="#" data-id="18" data-action="unlike" class="like button">Unlike </a>, так что и данные-действие, и текст обновляются правильно, но затем, если я нажимаю на нее снова, она не "не нравится" изображению. Не уверен, что здесь происходит, так как когда атрибут data-action равен "unlike", атрибут

else:
  images.users_like.remove(request.user)

пропорция представления должна вступить в силу, кажется, что представление не вызывается снова, но я не уверен. Спасибо за любую помощь.

Вернуться на верх