我想使用 Django 分页对数据库中的行进行分页，但使用 Ajax 和 JQuery 保持在同一页面上。我可以正确地可视化检索到的数据的第一页，但导航页面的链接不起作用。我知道我粘贴了很多代码，但我没有在互联网上找到完整的工作示例，所以我希望在这里得到一个。你能帮我吗？提前致谢。
使用Django pagination docs，到目前为止，我已经完成了以下工作：
urls.py：
from django.conf.urls.defaults import *
from django.contrib.auth.views import login, logout
urlpatterns = patterns('gomos.views',
url(r'^$', login, name='login'),
url(r'^out', logout, {'next_page': '/gomos'}, name='logout'),
url(r'^main', 'index', name='main'),
(r'^getGomosProducts', 'getGomosProducts'),
)
视图.py
from django.contrib.auth import authenticate, login, logout
from django.contrib.auth.views import logout_then_login
from django.contrib.auth.decorators import login_required
from django.http import HttpResponse, HttpResponseRedirect, HttpRequest
from django.core.urlresolvers import reverse
from gomos.models import *
from django.shortcuts import render_to_response
from django.template import RequestContext
from decimal import *
import datetime
from django.utils.timezone import utc
from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
@login_required
def index(request):
return render_to_response('gomos/index.html',
{},
context_instance=RequestContext(request))
@login_required
def getGomosProducts(request):
get = request.GET
startDate = get['startDate']
stopDate = get['stopDate']
startY = Decimal(startDate[:4])
startM = Decimal(startDate[5:-3])
startD = Decimal(startDate[-2:])
stopY = Decimal(stopDate[:4])
stopM = Decimal(stopDate[5:-3])
stopD = Decimal(stopDate[-2:])
start = datetime.datetime(startY, startM, startD, tzinfo=utc)
stop = datetime.datetime(stopY, stopM, stopD, tzinfo=utc)
productList = GomosFiles.objects.filter(prod_date__range=(start, stop)).all()
paginator = Paginator(productList, 30)
page = request.GET.get('page')
try:
products = paginator.page(page)
except PageNotAnInteger:
products = paginator.page(1)
except EmptyPage:
products = paginator.page(paginator.num_pages)
return render_to_response('gomos/prodList.html',
{'products': products},
context_instance=RequestContext(request))
索引.html
{% extends "base.html" %}
{% block header %}
{% load url from future %}
<div id="idLogOutDiv" class="logOutDiv">
<form id="idLogOutForm" action="{% url 'logout' %}" method="post">{% csrf_token %}
<span id="welcomeUserId" class="welcomeUserClass">Welcome, <strong>{{ user.username }}</strong></span>
<button id="idLogOutSubmit" name="idLogOutSubmit" type="submit">Logout</button>
</form>
</div>
{% endblock header %}
{% block content %}
<span>From <input type="text" id="fromDatePicker" /></span>
<span>to <input type="text" id="toDatePicker" /></span>
<button type="button" id="searchBut">Search</button>
<div id="prodList"></div>
{% endblock content %}
产品列表.html
{% for prod in products %}
<span id="prod-id-{{ prod.id }}">{{ prod.id }}</span>
<span id="prod-name-{{ prod.id }}">{{ prod.file_name }}</span></br>
{% endfor %}
<div class="pagination">
<span class="step-links">
{% if products.has_previous %}
<a class="prev" href="getGomosProducts?page={{ products.previous_page_number }}">previous</a>
{% endif %}
<span class="current">
Page {{ products.number }} of {{ products.paginator.num_pages }}.
</span>
{% if products.has_next %}
<a href="getGomosProducts?page={{ products.next_page_number }}">next</a>
{% endif %}
</span>
</div>
实用程序.js
$(document).ready(function(){
$("#searchBut").click(function(){
if($("#fromDatePicker").val() == "")
$("#fromDatePicker").datepicker("setDate", minDate);
if($("#toDatePicker").val() == "")
$("#toDatePicker").datepicker("setDate", maxDate);
var request = $.ajax({
type: "get",
url: "getGomosProducts",
data:{
'startDate': $("#fromDatePicker").val(),
'stopDate': $("#toDatePicker").val()
}
});
request.done(function(prodList){
$("#prodList").append(prodList);
});
});
});