在 django-tables2 中动态设置 per_page

dynamically set per_page in django-tables2

网站通常允许用户在分页 table 中指定每页显示多少项目。我想用 django-tables2.

做这个

我可以添加一个 "Show [ 5 | 10 | 50 ] per page" select 框来收集用户的 per_page 参数。

但是,table 模板中的 "Previous" 和 "Next" 按钮是超链接,具有 per_page 的硬编码值,例如:

<a href="?per_page=5&page=5">Next</a>

我认为使这种动态变化的唯一方法是使用 javascript,例如:

<span onclick="get_table_page(5)">Next</span>

函数 get_table_page() 可以从 select 框中检索 per_page 参数。

这是最好的方法吗?或者有什么办法不用 javascript?

更新:问题没有答案(如何为 Previous/Next 页面更改 per_page)但是,正如已接受的答案指出的那样,用户可以重新加载当前页面并更改 per_page参数,例如:

<p>Show [ <a href="{% querystring "per_page"=5  %}">5</a>
        | <a href="{% querystring "per_page"=20 %}">20</a>
        | <a href="{% querystring "per_page"=50 %}">50</a>
        ] Items</p>

感谢和祝福

伊万

django-tables2 支持 table.paginate()per_page 关键字参数。如果使用 RequestConfig 或基于 class 的视图之一,只需将 per_page=20 添加到 url 将使 django-tables2 重新呈现每页 20 行。

您可以使用 {% querystring per_page=20 %} 标签在您的自定义模板中创建 url,这应该保持 sorting/filtering 不变。

我不知道如何找到当前查询字符串(使用不同的参数)所以我在我的模板中写道:

Show <select id="select_per_page" onchange="perPageChange($(this).val())">
    <option value="10">10</option>
    <option value="25">25</option>
    <option value="50">50</option>
    <option value="100">100</option>
</select> items

还有一些 javascript :

<script>
    function perPageChange(per_page)
    {
        /* per_page in querystring : replace the value in the current url */
        if (location.href.indexOf('per_page=') > 0)
            url = location.href.replace(/(per_page=)[^\&]+/, '' + per_page)
        else
        {
        /* per_page not in querystring */
            /* is there a parameter in querystring */
            if (location.href.indexOf('?') > 0)
                addStr = '&'
            else
                addStr = '?'
            addStr += 'per_page=' + per_page
            url = location.href + addStr
        }
        /* reload the page */
        location.href = url;
    }

    /* to select the correct option in the select */
    $('#select_per_page').val({{ table.page.object_list|length }});
</script>