django.core.paginator Ajax нумерация страниц с помощью jQuery

Question

Проблема

Мне нужна нумерация страниц Ajax с использованием jQuery в шаблоне Django.

Ситуация

В моем шаблоне есть следующий код:

<script type="text/javascript">
$(document).ready(function() {
    $("#next-page").click(function() {
        var page = {{ vms.next_page_number }};
        $("#vms").html('&nbsp;').load (
            '{% url virtualmachine-list %}?page=' + q );
    });
});
</script>

[code omitted]

<table>
<thead>

    [code omitted]

</thead>
<tbody id="vms">
    {% for vm in vms.object_list %}

         [code omitted]

    {% endfor %}
</tbody>
</table>


[code omitted]

{% if vms.has_next %}
    <!--<a href="?page={{ vms.next_page_number }}" id="next-page">Next</a>-->
        <a href="#" id="next-page">Next</a>
    {% endif %}
</span>

и мой взгляд:

def list_(request):
    vms = VirtualMachine.objects.all()
    paginator = Paginator(vms, 10)

    page = 1
    if request.is_ajax():
        query = request.GET.get('page')
        if query is not None:
            page = query

    try:
        vms = paginator.page(page)
    except (EmptyPage, InvalidPage):
        vms = paginator.page(paginator.num_pages)

    return render_to_response('virtual_machine/list.html', {
        'vms': vms,
        },
        context_instance=RequestContext(request),
    )

Заключение

Итак, всякий раз, когда я нажимаю «Далее», он на самом деле выполняет запрос Ajax, но данные не отображаются в таблице.

Для разбиения на страницы используется django.core.paginator, и я действительно хотел бы придерживаться его, когда это возможно.

Можете ли вы увидеть, что в коде отсутствует / нет?

Answer 1

Я не нашел ошибку, но я покажу вам ниже, как я решил эту задачу.Я думаю, что вы можете легко адаптировать его к вашим потребностям.

Часть jjery ajax:

<script type="text/javascript">
function ajax_get_update()
    {
       $.get(url, function(results){
          //get the parts of the result you want to update. Just select the needed parts of the response
          var table = $("table", results);
          var span = $("span.step-links", results);

          //update the ajax_table_result with the return value
          $('#ajax_table_result').html(table);
          $('.step-links').html(span);
        }, "html");
    }

//bind the corresponding links in your document to the ajax get function
$( document ).ready( function() {
    $( '.step-links #prev' ).click( function(e) {
        e.preventDefault();
        url = ($( '.step-links #prev' )[0].href);
        ajax_get_update();
    });
    $( '.step-links #next' ).click( function(e) {
        e.preventDefault();
        url = ($( '.step-links #next' )[0].href);
        ajax_get_update();

    });
});

//since the links are reloaded we have to bind the links again
//to the actions
$( document ).ajaxStop( function() {
    $( '.step-links #prev' ).click( function(e) {
        e.preventDefault();
        url = ($( '.step-links #prev' )[0].href);
        ajax_get_update();
    });
    $( '.step-links #next' ).click( function(e) {
        e.preventDefault();
        url = ($( '.step-links #next' )[0].href);
        ajax_get_update();
    });
});
</script>

Часть HTML-шаблона:

<div class="pagination">
            <span class="step-links">
                {% if object_list.has_previous %}
                <a id="prev" href="?{{ urlquerystring_previous_page }}">previous</a>
                {% else %}
                <span style="visibility:hidden;">previous</span>
                {% endif %}

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

                {% if object_list.has_next %}
                            <a id="next" href="?{{ urlquerystring_next_page }}">next</a>
                {% else %}
                            <span style="visibility:hidden;">next</span>
                {% endif %}
            </span>
        </div>

            <form class="" id="action-selecter" action="{{ request.path }}" method="POST">

            <div id="ajax_table_result">
                <table class="w600" cellspacing="5">
                    <thead>
                        {% table_header headers %}
                    </thead>
                        <tbody>
                          ....

Answer 2

Это должен быть request.is_ajax(), is_ajax() - это метод!