Django + Ajax: обновление контента без рефеша

Question

В настоящее время я пытаюсь разработать клон Facebook для универа.Я хочу сделать кнопку «Мне нравится» (здесь она называется «Дать лазанью») и сделать так, чтобы она обновлялась без обновления страницы.Пока что мне это удалось, но он только обновляет мой первый пост, он не работает ни для одного из других постов.

[Изображение того, как это выглядит: https://i.gyazo.com/0e239fc05b401e5d1d96b6a1e08063e1.png]

Я уже попробовал кучу вещей, но ничто не привело меня к разрешению, поэтому я пишу здесь.

Итак, вот мои шаблоны: home.html (гдемы называем сценарий ajax)

     {% for post in posts %}
        {% if post.content is None %}
            <script>
                var x = '{{ post.id }}';
                $(document).ready(function (event) {
                    var x = '#lasanha'+'{{ post.id }}'
                    $(document).on('click', '#lasanha'+'{{ post.id }}', function (event) {
                        console.log( "e."+x);
                        event.preventDefault();
                        var pk = $(this).attr('value');
                        $.ajax({
                            type: 'POST',
                            url: '{% url "give_lasanha" %}',
                            data: {'id':pk, 'csrfmiddlewaretoken': '{{ csrf_token }}' },
                            dataType: 'json',
                            success: function(response){
                                $('#lasanha_section').html(response['form'])
                            },
                        })
                    })
                })
            </script>
        {% endif %}
    {% endfor %}

<div id="lasanha_section" class="form-group">
                      {% include 'space/lasanha_section.html' %}
                </div>

lasanha_section.html

{{post.lasanhas.count}} Lasanha{{post.lasanhas.count|pluralize}}
<form action="{% url 'give_lasanha' %}" method="submit">
    <p id="er" value="{{post.id}}"></p>
    {% csrf_token %}
    {% if is_liked %}
        <button type="submit" id="lasanha{{post.id}}" name="post_id" value="{{ post.id }}" class="btn btn-outline-info">Steal lasanha</button>
    {% else %}
        <button type="submit" id="lasanha{{post.id}}" name="post_id" value="{{ post.id }}" class="btn btn-outline-info">Give lasanha</button>
    {% endif %}
</form>

my views.py:

@login_required
def give_lasanha(request):
    post = get_object_or_404(Post, id=request.POST.get('id'))
    is_liked = False
    if post.lasanhas.filter(user=request.user).exists():
        post.lasanhas.remove(request.user.galaxy)
        is_liked = False
    else:
        post.lasanhas.add(request.user.galaxy)
        is_liked = True

    context = {
        'post': post,
        'is_liked': is_liked,
        'total_liked': post.lasanhas.count(),
    }

    if request.is_ajax():
        html = render_to_string('space/lasanha_section.html', context, request=request)
        return JsonResponse({'form': html})

И так как это может быть важнотоже ... Модель моего поста:

class Post(models.Model):
    author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
    stars = models.ManyToManyField(Star)
    title = models.CharField(max_length=50)
    image = models.ImageField(upload_to='Galaxy_pics')
    lasanhas = models.ManyToManyField(Galaxy)
    content = models.TextField(null=True) #
    date_posted = models.DateTimeField(default=timezone.now)

Я считаю, что это каждый бит кода, которым я должен поделиться!Я ожидаю, что это работает для каждого поста (как на картинке выше), но он работает только для первого поста со страницы, а не для других.

Когда я нажимаю "Дать лазанью" наВ первом сообщении кнопка меняется на «Steal lasanha», а счетчик обновляется до 1 Lasanhas.

Когда я нажимаю на одну из других, ничего не происходит.

Заранее спасибо, что нашли времяпомочь.