django: автоматическое создание списка с поиском (стиль администратора)

Question

Какой самый простой способ создать представление списка для модели с кликабельными заголовками и полем поиска (фильтра), более или менее похожим на сайт администратора? Я немного читал об общих видах, но не вижу там простого решения.

Answer 1

Общие представления идеально подходят для создания такого рода функций. Сортировка таблиц, поиск и разбиение на страницы могут затем выполняться на стороне клиента с помощью плагинов javascript, таких как jQuery и DataTables .

Для этого вам нужно определить универсальное представление и включить его в urls.py:

.

from django.views.generic import ListView
from exampleapp.models import BlogPost

class BlogPostListView(ListView):
    """"Class that extends generic ListView"""

    template_name = "list.html" 

    def get_queryset(self):
        return BlogPost.objects.filter(published=True)


urlpatterns = patterns('',

    url('^list/$', BlogPostListView.as_view() ),
)

Все остальное делается в файле шаблона. Приведенный ниже код отображает таблицу с 3 столбцами и инициализирует плагин DataTables. Будут добавлены кнопки нумерации страниц и поисковый ввод, а ячейки заголовка будут активными для сортировки по заданному столбцу.

<script type="text/javascript" language="javascript" src="http://datatables.net/release-datatables/media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="http://datatables.net/release-datatables/media/js/jquery.dataTables.js"></script>
<script>
$(document).ready(function(){
    // Initalize DataTables on <table> tag with id="example"
    $('#example').dataTable();  
});
</script>


<table id="example">
    <thead>   <!-- header row -->
        <tr>
            <td>ID</td>
            <td>column1</td>
            <td>column2</td>
        </tr>
    </thead>
    <tbody>   <!-- data  -->
    {% for item in object_list.all %}
        <tr>
            <td>{{ item.id }}</td>
            <td>{{ item.column1 }}</td>
            <td>{{ item.column2 }}</td>
        </tr>
    {% endfor %}
    </tbody>
</table>