Django Ajax Likes 工作不正确：jQuery 的问题

Posted 2023-05-08

【中文标题】Django Ajax Likes 工作不正确：jQuery 的问题

【英文标题】：Django Ajax Likes Work Incorrectly: Problem With jQuery

【发布时间】：2019-10-18 09:31:02

【问题描述】：

我有一个点赞功能，它适用于“详细产品”。但是，我想在显示多个产品的主页上添加此功能。不确定，如何正确地做到这一点。

urls.py：

url(r'^like$', views.like_product, name='like_product')

base.html中的脚本：

<script type="text/javascript">
    $(document).ready(function(event)
        $(document).on('click', '#like', function(event)
            event.preventDefault();
            var pk = $(this).attr('value');
            $.ajax(
                type: 'POST',
                url: '% url 'like_product' %',
                data: 'id': pk, 'csrfmiddlewaretoken': ' csrf_token ',
                dataType: 'json',
                success: function(response)
                    $('#like-section').html(response['form'])
                    console.log($('#like-section').html(response['form']));
                ,
                error: function(rs, e)
                    console.log(rs.responseText);
                ,
            );
        );
    );
</script>

likes.html：

<form action="% url 'like_product' %" method="post">
    % csrf_token %
    % if is_liked %
        <button type="submit" id="like" name="product_id" value=" product.id " class="btn btn-danger">Dislike</button>
    % else %
        <button type="submit" id="like" name="product_id" value=" product.id " class="btn btn-primary">Like</button>
    % endif %
</form>

views.py：

def home(request):
    products = Product.objects.all().order_by('-pub_date')
    f = ProductFilter(request.GET, queryset=products)
    context = 
        'filter': f,
    
    return render(request, 'product/home.html', context).


def detail(request, product_id):
    product = get_object_or_404(Product, product_id=product_id)
    is_liked = False
    if product.likes.filter(id=request.user.id).exists():
        is_liked = True
    context = 
        'product': product,
        'is_liked': is_liked,
        'total_likes': product.total_likes()
    
    return render(request, 'product/detail.html', context)


def like_product(request):
    product = get_object_or_404(Product, id=request.POST.get('id'))
    is_liked = False
    if product.likes.filter(id=request.user.id).exists():
        product.likes.remove(request.user)
        is_liked = False
    else:
        product.likes.add(request.user)
        is_liked = True
    context = 
        'product': product,
        'is_liked': is_liked,
        'total_likes': product.total_likes()
    
    if request.is_ajax():
        html = render_to_string('product/likes.html', context, request=request)
        return JsonResponse('form': html)

如果从主页点击，喜欢/不喜欢会被正确记录，但是它们没有正确显示（喜欢和不喜欢按钮的实际数量只能在“详细产品”页面上看到）。我怀疑这是因为我在两个按钮的 likes.html 中都有id="like"。我怀疑jQuery 脚本也需要更改。不知道该怎么做。提前感谢您的帮助。

【参考方案1】：

我假设您正在从 URL 获取 ID 到详细信息页面。这实际上取决于您如何在页面上生成产品列表，但如果您在模板中使用循环，那么只需在每个产品下添加like按钮，然后使用它的 id 来设置 like 表单。

【讨论】：

问题可能出在 likes.html 表单中。我有喜欢和不喜欢按钮的id="like"。这对于“详细产品”页面来说很好，因为只有一个按钮，不喜欢或喜欢。但这不适用于可能显示两个按钮的主页。不太确定如何解决。