姜戈泛型。列表VIew：在同一页面上显示列表项的详细信息(~组合列表视图和详细信息视图)

Question

我想要的是在包含ListView的同一页面上显示被单击的ListView项的详细信息(粗略地说，组合通用)。ListView with generic.DetailView)。我所做的是:

通用。ListView of Contacts:

from .models import Contact
from django.views import generic
class ContactList(generic.ListView):
model = Contact
context_object_name = 'contacts'
template_name = 'contacts/list.html'

contacts/list.html模板包含一个JS GET请求(GET)来获取被点击的项目:

{% block content %}
{% if contacts %}
<ul>
{% for contact in contacts %}
<li><a id="{{ contact.id }}" onClick="showDetails(this.id)">{{ contact.first_name }}</a></li>
{% endfor %}
</ul>
{% else %}
No contacts. 
{% endif %}
<div id='contactDetail'></div>
<script type="text/javascript">
function showDetails(contactId){
console.log(contactId);
fetch(`http://127.0.0.1:8080/contacts/${contactId}`, {
headers: {
'Accept': 'application/json',
'X-Requested-With': 'XMLHttpRequest',
},
})
.then(response => {
// should 500 be processed?
return response.json();
})
.then(data => {
//Perform actions with the response data from the view
window.onload = function() {
// build html markup next
document.getElementById("contactDetail").innerHTML= ...;
} 
})
}
</script>
{% endblock content %}

处理这个Fetch-GET请求的Django视图是:

from django.shortcuts import get_object_or_404
from django.forms.models import model_to_dict
def contact_details(request, contact_id):
contact = get_object_or_404(Contact, pk=contact_id)
contact = {k: v for k, v in model_to_dict(contact).items() if v}
return JsonResponse(contact)

是正确的方式吗?

Answer 1

你的方式几乎没有问题。

在生产环境中，应该使用分页。这样就不会有太多的数据，我认为最好将所有字段与列表一起返回，但首先隐藏额外的字段，然后在单击时取消隐藏它们。