我正在尝试显示一个HTML表,该表每3秒动态更新一次。在一些帮助下,我设法使此部分正常工作,但是,一旦数据库变大,就需要分页。
Django-Pagination非常简单,但是我很难使它与其他Ajax复杂性一起使用。
我看了相关的SO问题,但是它们要么很老,要么没有答案。
代码:
index.html
{% extends 'app/base.html' %}
{%load staticfiles %}
{% block body_block %}
<div class="container" >
{% if elements %}
<table id="_appendHere" class="table table-bordered">
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
<th>D</th>
<th>User</th>
<th>Date</th>
</tr>
{% for e in elements %}
<tr>
<td><a href="{{ e.A.url }}">{{e.A}}</a></td>
<td><a href="{{ e.B.url }}">{{e.B}}</a></td>
<td>{{ e.C }}</td>
<td>{{ e.D }}</td>
<td>{{ e.User }}</td>
<td>{{ e.Date }}</td>
</tr>
{% endfor %}
</table>
{% else %}
No data to display! <br/>
{% endif %}
</div>
{% endblock %}
<script>
setInterval(function() {
$.ajax({
type: "GET",
url: "get_more_tables/", // URL to your view that serves new info
})
.done(function(response) {
$('#_appendHere').append(response);
});
}, 1000)
</script>
views.py
def paginate(input_list, request):
page = request.GET.get('page', 1)
paginator = Paginator(input_list, 10)
elements = paginator.page(page)
return {'elements': elements}
def index(request):
elements = ElementFile.objects.all().order_by('-upload_date')
context_dict = {'elements':elements}
response = render(request,'app/index.html',context_dict)
return response
def get_more_tables(request):
elements = ElementFile.objects.all().order_by('-upload_date')
context_dict = paginate(elements, request)
return render(request, 'app/get_more_tables.html', context_dict)
get_more_tables.html
<tbody>
<table>
<tr><...corresponding th blocks omitted...></tr>
{% for e in elements %}
<tr>
<td><a href="{{ e.A.url }}">{{e.A}}</a></td>
<td><a href="{{ e.B.url }}">{{e.B}}</a></td>
<td>{{ e.C }}</td>
<td>{{ e.D }}</td>
<td>{{ e.User }}</td>
<td>{{ e.Date }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% if e.has_other_pages %}
<ul class="pagination">
{% if e.has_previous %}
<li><a class = "pag" href="?page={{ e.previous_page_number }}">«</a></li>
{% else %}
<li class="disabled"><span>«</span></li>
{% endif %}
{% for i in e.paginator.page_range %}
{% if e.number == i %}
<li class="active"><span>{{ i }} <span class="sr-only">(current)</span></span></li>
{% else %}
<li><a class = "pag" href="?page={{ i }}">{{ i }}</a></li>
{% endif %}
{% endfor %}
{% if e.has_next %}
<li><a class = "pag" href="?page={{ e.next_page_number }}">»</a></li>
{% else %}
<li class="disabled"><span>»</span></li>
{% endif %}
</ul>
{% endif %}
urls.py
urlpatterns = [
path('', views.index, name=''),
path('get_more_tables/', views.get_more_tables, name='get_more_tables'),
]
当前,该表正在自动更新,并已分页。但是,如果我单击“下一步”或2-10之间的页码,它只会重新加载第一页。我也尝试将分页器代码复制到index.html,但这也无济于事。 我注意到,如果我到达get_more_tables?page = 2,那么在那里我会看到正确的数据。 如何使用这种Ajax复杂性加载分页数据? 非常感谢任何可以帮助您的人。已经被困了好几天了。