0

Ajax と JQuery を使用して、Django ページネーションを使用してデータベースから行をページ付けしたいのですが、同じページに残ります。取得したデータの最初のページを正しく視覚化できますが、ページ間を移動するためのリンクが機能しません。たくさんのコードを貼り付けていることはわかっていますが、インターネット上で完全に機能する例が見つからなかったので、ここで取得したいと考えています。助けてくれませんか?前もって感謝します。

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))

index.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 %}

prodList.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);
        });
    });
});
4

1 に答える 1

1

OK、自動解決; 変更は次のようにする必要があります。

prodList.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 %}
            <button onclick="getPage({{ products.previous_page_number }})">previous</button>
        {% endif %}

        <span class="current">
            Page {{ products.number }} of {{ products.paginator.num_pages }}.
        </span>

        {% if products.has_next %}
            <button onclick="getPage({{ products.next_page_number }})">next</button>
        {% 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").html(prodList);
        });
    });
});

function getPage(page){
    var request = $.ajax({
        type: "get",
        url: "getGomosProducts",
        data:{
            'startDate': $("#fromDatePicker").val(),
            'stopDate': $("#toDatePicker").val(),
            'page': page
        }
    });

    request.done(function(prodList){
        $("#prodList").html(prodList);
    });
}
于 2013-02-27T12:43:35.600 に答える