Django - 分页和排序列表

Posted 2023-02-24

【中文标题】Django - 分页和排序列表

【英文标题】：Django - pagination and sorting list

【发布时间】：2018-12-12 04:33:10

【问题描述】：

我想查看表格中模型对象的显示列表。 我想添加排序功能。

有可能在 Django 中进行如下排序：https://codepen.io/imarkrige/pen/vgmij？

我的意思是列名中的箭头。单击时将 asc 更改为 desc 的位置。 接下来是在更改页面时保持排序表。

我现在所做的是排序字段，但在更改页面时它没有保存。

我的基本通用视图包含：

% block pagination %
    % if is_paginated %
        <div class="pagination">
            <span class="page-links">
                % if page_obj.has_previous %
                    <a href=" request.path ?page=  page_obj.previous_page_number ">previous</a>
                % endif %
                <span class="page-current">
                    Page  page_obj.number  of  page_obj.paginator.num_pages .
                </span>
                % if page_obj.has_next %
                    <a href=" request.path ?page= page_obj.next_page_number ">next</a>
                % endif %
            </span>
        </div>
    % endif %
% endblock %

我的看法：

class VotesList(generic.ListView):
    model = Vote
    template_name = 'votes-list.html'
    paginate_by = 5

    def get_queryset(self):
        order = self.request.GET.get('orderby', 'created_date')
        new_context = Vote.objects.order_by(order)

        return new_context

    def get_context_data(self, **kwargs):
        context = super(VotesList, self).get_context_data(**kwargs)
        context['orderby'] = self.request.GET.get('orderby', 'created_date')

        return context

我的模板：

% block content %
    % if vote_list %

<form method="get" action="% url 'votes-list' %">
    <p>Sortuj: <input type="text" value=orderby name="orderby"/></p>
    <p><input type="submit" name="submit" value="Zatwierdź"/></p>
</form>
        <table id="vote_list">
            <thead>
                <tr>
                    <th>Właściciel</th> 
                    <th>Grupa</th> 
                    <th>Rada</th> 
                    <th>Status</th> 
                    <th>Pytanie</th>
                    <th>Odp A</th>
                    <th>Odp B</th>
                    <th>Odp C</th>
                    <th>Odp D</th>
                    <th>Odp E</th>
                    <th>Odp F</th> 
                    <th>Data utworzenia</th>
                    <th>Data rozpoczęcia</th>
                    <th>Data zakończenia</th>
                </tr>
            </thead>
            <tbody>
                % for vote in vote_list %
                    <tr>
                        <td> vote.user </td>
                        <td> vote.group </td>
                        <td> vote.council </td>
                        <td> vote.get_status </td>
                        <td><a href=" vote.get_absolute_url "> vote.question </a></td>
                        <td> vote.ans_a </td>
                        <td> vote.ans_b </td>
                        <td> vote.ans_c </td>
                        <td> vote.ans_d </td>
                        <td> vote.ans_e </td>
                        <td> vote.ans_f </td>
                        <td> vote.created_date </td>
                        <td> vote.begin_date </td>
                        <td> vote.finish_date </td>
                    </tr>
                % endfor %
            </tbody>
        </table>

    % else %
        <p>Brak głosowań!</p>
    % endif %
% endblock %

【参考方案1】：

您可以通过在分页链接中将order 添加到href 的末尾来保存没有JS 的排序顺序。喜欢：

% if page_obj.has_previous %
    <a href=" request.path ?page=  page_obj.previous_page_number &order=order">previous</a>
% endif %

【参考方案2】：

您可以使用 javascript 来进行排序，特别是 datatablejs 可以帮助解决这个问题。但是，在页面更改之间保存排序列表的状态可能必须使用 cookie 完成。这可能比使用 ajax 请求将用户对“排序”的偏好存储为用户模型的一部分更容易。

以下是有关如何制作 cookie 的参考： https://www.quirksmode.org/js/cookies.html

您可能想要做的是将排序顺序保存在 cookie 中，然后在页面加载时读取它。阅读后，您可以以这种方式设置排序顺序。

【讨论】：

嗯，唯一的可能是用 Ajax 或 JS 来做这件事？我用这样的东西来扩展 url： "mypage/votes/?page=&order_by="" "Next" 和 "Previous" 按钮只会改变 url 和 "Ordering" 中的 "page="选择字段只会改变一个“order_by”。然后这个在视图中捕获的值将设置排序。我希望它解释清楚。:)

我知道你来自哪里，这里的关注点分离，取决于你的服务器要扩展多少。根据大小和其他变量，排序数据的操作仍然很昂贵。在这个时代，您可以利用客户端的浏览器使用 JS 进行客户端渲染。当然它仍然很昂贵，因为你必须在那里编写资源库或 JS 来做到这一点。想想必须为各种路由创建 url 端点，只是为了再次处理和发送数据……这工作量太大了。

你说得对，我明白了。大量数据意味着大量操作=低性能，这就是为什么最好使用JS。现在问题：我应该寻找现成的解决方案还是自己做？我的意思是在开发 web 时最好自己制作或使用一些现有的解决方案，比如现成的库？我认为我的项目不需要一些复杂的功能，只需简单的按列名排序即可。

是的，对于基本的数据表显示，有一个名为 datatablejs 的库，文档也很有帮助。看看它，如果你仍然决定在服务器端做更多的操作，你可以利用 Jquery onchange 函数发送 ajax 请求来查询更多数据。您要记住的是，您不希望向服务器查询更多信息以获取填充视图。