Question

（我正在使用jquery和django）

假设我有一个待办事项列表，每个项目都有一个唯一的主键（pk）。在模板中，我使用for循环列出这些项目，以便每个项目都可以单击，以在页面的另一部分显示项目详细信息（当然不重新加载整个页面）。

普遍接受的最佳方式是什么？

我尝试了多种“唯一化”每个div的方法，以及在ajax请求中传递此pk的多种方法。

第1部分 - 获取独特的div：

我把pk作为后缀添加到每个div的id中。例如{％为项目在todolist％}的东西 $（'body'）。on（'click'，“＃item _ {{item.pk}}”，function（）{var id = {{item.pk}} ,. ajax stuff}） {％endfor％}
而不是后缀pk，我添加一个名为的自定义html属性数据-ID。这允许我使用.attr（“data-id”）来获取pk 单击的div并从for循环中删除js。
我没有添加自定义的html属性，而是添加了一个隐藏的表单字段。

第2部分 - 将pk传递给ajax请求：

在$ .ajax（）主体中，我设置了url：id +“/ details”，数据字段为空。在Django中，我从url regex定义中获取了id。
在$ .ajax（）主体中，我使用数据：{id：id}设置url：“/ details”。在Django中，我使用request.POST ['id']。
在js中，我只是提交表格。 Django将id作为表单字段。

所以...有这么多（可能是坏的）这样做的方法，你会用哪个？

Answer 1

我将使用单个ajax函数，它应该是：

{% for item in todolist %}
    <div id="{{item.id}}" class="item_ajax" >{{item.name}}</div>
{% endfor %}

<script>
    $('.item_ajax').click(function(){
        $.ajax({
              type: 'POST',
              url: '{% url item_url %}',
              data: {'id': $(this).attr('id'), 'csrfmiddlewaretoken': '{{csrf_token}}'},
              dataType: "text",
              success: function(response) {
                  // do something
              },
              error: function(rs, e) {
                  alert(rs.responseText);
              }
         }); 
    });
</script>

我使用了class选择器，显然你可以选择你喜欢的东西，例如拥有自定义属性但它应该是常见的。

最常见的方法来构建依赖于Django pk的类似但独特的ajax请求？

1 个答案: