Пагинация с AJAX в Django?

Question

[nurzhannogerbek]

Здравствуйте! Помогите пожалуйста разобраться.

Пытаюсь использовать приложение django-el-pagination, так как необходима пагинация с AJAX-ом. На странице есть два блока со списком проектов. Вроде все сделал по докам, но есть 2 проблемы.

1) Мне кажется ajax не работает, так как обновляется вся страница а не конкретный блок.

2) Вторую проблемы очень трудно описать словами, для наглядности привел скриншоты. Есть 2 блока с записями (Currect Projects и Arhive Projects). Когда перехожу на другую страницу по пагинации происходит такая вот странная вложенность. Что делаю не так?

home.html:

{% block content %}
   <div class="card">
      <div class="card-block endless_page_template">
         {% include "home/currect_projects.html" %}
      </div>
   </div>

   <div class="card">
      <div class="card-block endless_page_template">
         {% include "home/archive_projects.html" %}
      </div>
   </div>
{% endblock %}

{% block script %}
    {{ block.super }}
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="{% static 'el-pagination/js/el-pagination.js' %}"></script>
    <script>$.endlessPaginate();</script>
{% endblock %}

views.py:

@page_template('home/currect_projects.html', key='currect_projects')
@page_template('home/archive_projects.html', key='archive_projects')
def home(request, template='home.html', extra_context=None):
    context = {
        'archive_projects': Project.objects.filter(status='close').order_by('-revision_date'),
        'currect_projects': Project.objects.filter(status='open').order_by('-revision_date'),
    }
    if extra_context is not None:
        context.update(extra_context)
    return render(request, template, context)

currect_projects.html:

{% load el_pagination_tags %}

{% paginate 1 currect_projects %}
{% for currect_project in currect_projects %}
    {{ currect_project.name }}
    {{ currect_project.description|truncatewords:20 }}
{% endfor %}
{% show_pages %}

Изначально страница выглядит вот так:


После перехода на вторую страницу происходит такое:

Comments

[Павел Аксенов]

Тут надо или на сервере отдавать другой шаблон (без рамки с CURRENT PROJECTS) или JavaScript'ом вставлять только определенную часть.

[nurzhannogerbek]

Павел Аксенов: Здравствуйте, Павел! Я делал на основе примера в документации. Там вроде написано, как применить несколько пагинаций с ajax на одной странице. Был уверен, что не нужны будут дополнительные манипуляции.

В доках во view было написано:

return render_to_response(template, context, context_instance=RequestContext(request))

Данный код я у себя заменил на следующий код, так как у меня Джанго 1.10. Не знаю повлияло ли это на такой результат.
return render(request, template, context)

Я тоже думал, а втором вами предложенном варианте, но не совсем понимаю как это все связать. Получается нужно переписать view? Можете показать на примере? Я вот начал, что-то на подобии этого, но не совсем понял как в js указать что конкретно менять...

views.py:

def home(request):
    data = dict()
    currect_projects = Project.objects.filter(status='open').order_by('-revision_date'),
    arhive_projects = Project.objects.filter(status='close').order_by('-revision_date'),
    if request.is_ajax():
        data['html_currect_projects'] = render_to_string('currect_projects ': currect_projects)
        data['html_arhive_projects'] = render_to_string('arhive_projects ': arhive_projects)
    context = {'currect_projects ': currect_projects, 'arhive_projects': arhive_projects}
    data['html_home'] = render_to_string('home.html', context, request=request)
    return JsonResponse(data)

Javascript: (каждому блоку присвоил уникальный id)

$("#currect-projects-block .card-block").html(data.html_currect_projects);

[Павел Аксенов]

NogerbekNurzhan: тут в #currect-projects-block .card-block добавляется вся эта страница в html().
Так же получается, что при нажатии на страницу "2", будет выбрана вторая страница как для текущих проектов, так и для архивных(сейчас это не видно, так как нет архивных).
Тут можно рендерить home как и сейчас, а все ссылки на страницы отправлять на другие урлы, к примеру создать еще 2 вьюхи. Одна вьюха будет отдавать данные только для текущих проектов, а вторая для архивных.
На счет "JavaScript'ом вставлять только определенную часть" в данном случае не очень решение.

[nurzhannogerbek]

Павел Аксенов: Я вас вроде понял в целом, а как Django будет понимать какую вьюху открыть и как подобная вьюха должна выглядеть?

Вот такая ссылка генерируется в пагинации к примеру:

<a href="/ru/?page=2" data-el-querystring-key="page" class="endless_page_link">&gt;</a>

[Павел Аксенов]

NogerbekNurzhan: я не сталкивался с пакетом django-el-pagination.
Если я правильно понимаю, то вот это {% paginate 20 entries with "/mypage/" %} должно помочь.

[nurzhannogerbek]

Павел Аксенов: Cпасибо большое вам! По вашему совету создал две view и две url для каждого блока и использовал вышеупомянутую запись. Заработало =)

[Павел Аксенов]

NogerbekNurzhan: на здоровье)