Question

这是我的代码，为简洁而缩短。

HTML模板

{% for question in questions %}
    <div class="upvote"></div>
{% endfor %}

# lots of code later...

<script>
    $(".upvote").click(function(){
        $.ajax({
            type: "POST",
            url: "{% url 'upvote_for_question' %}",
            data: {
                'question': question
            },
            }
        })
    })
</script>

我的<div class="upvote">元素是一个问题的upvote按钮（想想Stack Overflow＆＃39; upvote按钮）。如代码所示，question中的每个question_list都有一个upvote按钮。

我的问题是，当用户按下upvote按钮时，如何将关联的question pk / id传递给视图？

Answer 1

一种方法是为upvote定义url：

url(r'^questions/(?P<question_id>\w+)/upvote', views.question_upvote, name='question_upvote')

然后在模板中使用反向网址功能，并在数据属性中传递网址，如：

{% for question in questions %}
    <div class="upvote" 
         id="button-{{ question.pk}}" 
         data-href="{% url 'question_upvote' question.pk %}">{{ question.upvotes }}
    </div>
{% endfor %}

修改您的jQuery以从data-href属性获取网址并添加CSRF令牌，否则POST将失败，状态为403。类似的东西：

$(".upvote").click(function(){
    var postData = {csrfmiddlewaretoken: '{{ csrf_token }}'}
    $.ajax({
        type: "POST",
        url: $(this).attr("data-href"),
        data: postData,
        success: function(new_number_of_upvotes) {
            $(this).html(new_number_of_upvotes)
        }
    })
})

反映这些变化的更新视图将具有以下意义：

def question_upvote(request, question_id):
    if request.is_ajax() and request.method == 'POST':
        question = get_object_or_404(Questions, pk=question_id)
        question.upvotes += 1
        question.save()
        return HttpResponse(question.upvotes)
    else:
        return HttpResponseRedirect('/')

我还没有对此进行测试，但我想它应该可行。

Answer 2

您可以先给每个div一个唯一的id：

{% for question in questions %}
    <div class="upvote" id="button-{{ question.pk}}"></div>
{% endfor %}

然后在帖子数据中传递：

data: {
    'question': $(this).attr('id')
},

Django - 使用jQuery ajax将列表项的id / pk传递给视图

2 个答案: