使用flask-paginate 0.4.5

时间:2017-01-18 12:22:22

标签: flask pagination flask-sqlalchemy multiple-instances paginate

enter image description here我想使用flask-paginate在一个页面上渲染三个分页。 问题在于三个分页是同步的"从某种意义上说,点击下一页'一个分页也影响另一个分页。 我试图使用不同的页面名称进行不同的分页,但仍然缺少一些东西。 我还没有找到关于多重分页的事情,请帮助我解决这个问题。 请仔细阅读图片,了解更好的理解。 请注意,我在创建此应用程序时遵循了Miguel Gringberg的书,但他只考虑单个分页而不是多个分页。 https://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world

我有一个页面'' discover.html''有3个分页元素列表:

<div class="discover-content">

        <div class="contests-list">
            {% with projects=contests, pagination=contests_pagination, page='main.discover', fragment='#contests' %}
                <h2>Most Recent Contests</h2>
                {% include '_contests.html' %}
            {% endwith %}
        </div>

        <div class="skills-list">
            {% with skills=skills, pagination=skills_pagination, page='main.discover', fragment='#skills' %}
                <h2>Skills</h2>
                {% include '_skills.html' %}
            {% endwith %}
        </div>

        <div class="ideas-list">
            {% with projects=ideas, pagination=ideas_pagination, page='main.discover', fragment='#ideas' %}
                <h2>Most Recent Ideas</h2>
                {% include '_ideas.html' %}
            {% endwith %}
        </div>

</div>

每个列表如下所示&#39;&#39; _skills.html&#39;&#39;:

{% import "_macros.html" as macros %}

<ul class="skills">
    {% for skill in skills %}
        {% if skill.name %}
        <li class="skill">{{ skill.name }}</li>
        {% endif %}
    {% endfor %}
</ul>

{% if pagination %}
    <div class="pagination">
        {{ macros.pagination_widget(pagination, page, fragment=fragment) }}
    </div>
{% endif %}

文件&#39;&#39; _macros.html&#39;&#39;以这种方式工作:

{% macro pagination_widget(pagination, endpoint, fragment='') %}
<ul class="pagination">
    <li{% if not pagination.has_prev %} class="disabled"{% endif %}>
        <a href="{% if pagination.has_prev %}{{ url_for(endpoint, page=pagination.prev_num, **kwargs) }}{{ fragment }}{% else %}#{% endif %}">
            &laquo;
        </a>
    </li>
    {% for p in pagination.iter_pages() %}
        {% if p %}
            {% if p == pagination.page %}
            <li class="active">
                <a href="{{ url_for(endpoint, page = p, **kwargs) }}{{ fragment }}">{{ p }}</a>
            </li>
            {% else %}
            <li>
                <a href="{{ url_for(endpoint, page = p, **kwargs) }}{{ fragment }}">{{ p }}</a>
            </li>
            {% endif %}
        {% else %}
        <li class="disabled"><a href="#">&hellip;</a></li>
        {% endif %}
    {% endfor %}
    <li{% if not pagination.has_next %} class="disabled"{% endif %}>
        <a href="{% if pagination.has_next %}{{ url_for(endpoint, page=pagination.next_num, **kwargs) }}{{ fragment }}{% else %}#{% endif %}">
            &raquo;
        </a>
    </li>
</ul>
{% endmacro %}

与页面关联的视图&#39;&#39; discover.html&#39;&#39;如下:

@main.route('/discover', defaults={'page_c': 1, 'page_i': 1, 'page_s': 1}, methods=['GET', 'POST'])
@main.route('/discover/page_c/<int:page_c>/page_i/<int:page_i>/page_s/<int:page_s>', methods=['GET', 'POST'])
def discover(page_c, page_i, page_s):

    contests_page = request.args.get(page_c, 1, type=int)
    contests_pagination = Project.query.filter_by(project_type='contest').order_by(Project.timestamp.desc()).paginate(
        contests_page, per_page=current_app.config['CONTESTS_PER_PAGE'], error_out=False)
    contests = contests_pagination.items

    ideas_page = request.args.get(page_i, 1, type=int)
    ideas_pagination = Project.query.filter_by(project_type='idea').order_by(Project.timestamp.desc()).paginate(
        ideas_page, per_page=current_app.config['IDEAS_PER_PAGE'], error_out=False)
    ideas = ideas_pagination.items

    skills_page = request.args.get(page_s, 1, type=int)
    skills_pagination = Skill.query.order_by(Skill.name.desc()).paginate(
        skills_page, per_page=current_app.config['SKILLS_PER_PAGE'], error_out=False)
    skills = skills_pagination.items


    return render_template('discover.html', contests=contests, ideas=ideas, skills=skills,
                           contests_pagination=contests_pagination, ideas_pagination=ideas_pagination,
                           skills_pagination=skills_pagination)

1 个答案:

答案 0 :(得分:1)

处理此问题的最明确方法是使用异步请求(Ajax)。对于三个项目列表,您将有三个单独的端点,每个端点都单独进行分页。主HTML页面将向这三个端点发出Ajax请求,在一个列表中的页面之间移动不应该影响其他两个列表。

如果您希望将其作为包含三个列表的单个页面继续执行,则必须确保所有列表中的分页链接包含所有三个列表的正确页码。例如,如果您分别在这三个列表中查看第1,2和3页,并且您在第二个列表中点击下一页,则该下一页链接应该转到/discover/page_c/1/page_i/3/page_s/3,以便第一个和第三个列表留在第1页和第3页,第二个列表从第2页移到第3页。您的宏需要更复杂,它需要知道三个列表的页码,以及哪些列表正在更改。