wp_list_table

WP_List_Table – пошаговое руководство

Класс WP_List_Table в WordPress используется для отображения списка данных, например, пользователей, плагинов, комментариев или постов. Этот класс содержит почти все методы отображения, сортировки, разбиения на страницы и поиска информации. А что может быть очевиднее, чем его использование для создания собственных плагинов?

В этой статье мы постараемся разобрать по шагам создание таблицы, полностью подстроенной под ваши нужды. Здесь аренда выделенного сервера

  1. Предварительная работа
  2. Основы
  3. Сортировка
  4. Действия
  5. Массовые действия
  6. Разбиение на страницы
  7. Поиск
  8. Настройки экрана
  9. Стили таблиц
  10. Другие настройки

Предварительная работа

Для пробы, мы создадим небольшой плагин, добавляющий пункт меню:

Основы

Для начала, мы создадим таблицу, имеющую только базовые функции. В первую очередь нам нужно убедиться, что необходимый класс включён, поскольку WP_List_Table не загружается автоматически:

Чтобы создать свою таблицу, вам нужно получить класс из WP_List_Table:

Далее создаём пример данных. Обычно эти данные читаются из базы данных:

Прежде чем мы сможем отобразить данные в таблице, мы должны определить некоторые методы и переменные:

Метод get_columns() необходим для маркировки столбцов внизу и вверху таблицы. Ключи в массиве должны быть теми же, что и в массиве данных, иначе соответствующие столбцы не будут отображены.

prepare_items определяет два массива, управляющие работой таблицы:

  • $hidden определяет скрытые столбцы (см. Опции экрана),
  • $sortable определяет, может ли таблица быть отсортирована по этому столбцу.

Наконец, метод назначает данные из примера на переменную представления данных класса — items.

Прежде чем отобразить каждый столбец, WordPress ищет методы типа column_{key_name}, например, function column_booktitle. Такой метод должен быть указан для каждого столбца. Но чтобы не создавать эти методы для всех столбцов в отдельности, можно использовать column_default. Эта функция обработает все столбцы, для которых не определён специальный метод:

В нашем примере метод возвратит заголовок для каждого столбца, а если столбец не найден, будет отображено содержимое массива $item.

Это основные компоненты, необходимые для того, чтобы определить пользовательский класс таблицы. Теперь всё, что вам нужно — это добавить страницу администрирования, создать экземпляр нашего класса, подготовить элементы и вызвать display(), чтобы отобразить таблицу:

Это минимальная возможная версия WP_List_Table:

Скачать пример минимального WP_List_Table

Сортировка

В данный момент элементы представлены в таком порядке, в котором они определены в коде, т.к. класс WP_List_Table не содержит код для сортировки. Он содержит только небольшой код для маркировки сортируемых столбцов. В разделе «Основы» уже была строка $sortable = array();, которая теперь будет изменена на:

Также нам нужен метод:

Таким образом заголовки столбцов, о которых мы говорили выше, заменены на ссылки и теперь, когда вы проводите над ними мышью, рядом появляются маленькие треугольники. Второй параметр в массиве значений $sortable_columns отвечает за порядок сортировки столбца. Если значение true, столбец будет сортироваться в порядке возрастания, если значение false, столбец сортируется в порядке убывания, или не упорядочивается. Это необходимо для маленького треугольника около названия столбца, который указывает порядок сортировки, чтобы строки отображались в правильном направлении:

Если вы щёлкаете на заголовок столбца, страница будет перезагружена, а $_GET будет содержать что-то вроде этого:

С этой информацией вы можете написать метод для сортировки наших данных из примера:

Теперь, чтобы реально сортировать данные, мы должны расширить prepare_items():

Если вы извлекаете информацию из базы данных (что наиболее вероятно), конечно же, лучше всего использовать непосредственно SQL ORDERBY.

Действия

Если вы хотите не только отображать элементы, но и управлять ими, вам нужно определить некоторые действия:

Эти действия появятся, если пользователь проведет курсор мыши над таблицей:

Если вы щёлкните на одну из ссылок действий, форма возвратит, к примеру, следующие данные в $_GET:

Массовые действия (Bulk actions)

Bulk action осуществляются посредством переписывания метода get_bulk_actions() и возврата связанного массива:

Этот код просто помещает выпадающее меню и кнопку «применить» вверху и внизу таблицы:

Флажки для строк должны быть определены отдельно. Как упоминалось выше, есть метод column_{column} для отображения столбца. cb-столбец – особый случай:

В данный момент этот метод не будет обрабатываться, потому что мы должны указать классу новый столбец, расширив метод get_columns():

Это также добавит в область заголовка флажок «выбрать всё»:

Если вы не хотите отображать в заголовке переключатель, просто установите значение на пустую строку. Однако вам всё ещё нужно определить пару ключ/значение, иначе никакие переключатели не будут отображаться вообще:

Если нажата кнопка «Применить», форма возвратит различные переменные: action и action2, содержащие выбранные действия или -1, если пользователь не выбрал никаких действий, а если были установлены какие-то флажки, будут возвращены отмеченные строки, в нашем случае books, к примеру:

action содержит выбор из верхнего выпадающего меню, action2 — из нижнего, а book — id выделенных строк, если таковые имеются. Можно использовать метод current_action(), чтобы обратиться к action/action2:

Будет возвращено action, если в меню установлен выбор, в противном случае action2. Если ничего не установлено, метод возвратит FALSE.

Разбиение на страницы

Прежде всего: WordPress не разбивает ваши данные на страницы ни в каком случае. Он только содержит метод для отображения навигационной панели в верхней правой и нижней правой частях таблицы:

Вы должны указать методу, сколько элементов у вас всего, сколько элементов нужно отобразить на странице, и самое главное, данные, которые должны быть отображены на странице:

Как указано в комментариях, array_slice необходим только потому, что мы используем данные из примера. Если вы извлекаете данные из базы данных, вам нужно только загрузить необходимые данные, используя SQL LIMIT.

Поиск

Если у вас большое количество данных, поисковая строка упростит доступ к определённым элементам:

Текст кнопки search определён первым параметром, id поля ввода — вторым. Результат будет следующим:

Метод поместит поисковую строку и кнопку поиска в правую сторону и правильно задаст их стиль. Элемент <form> не был сгенерирован. Вы должны добавить его вручную, в нашем случае так:

(Скрытый элемент необходим, чтобы загрузилась правильная страница)
Чтобы отреагировать на команду поиска, вам нужно проверить содержимое $_POST['s'] и отфильтровать свои данные, перед тем, как отобразить страницу.

Настройки экрана

Все основные внутренние страницы, содержащие WP_List_Table предоставляют раздел «Screen Options» («Настройки экрана»), где пользователь сможет выбрать, какие столбцы будут показаны, и какое количество строк будет отображаться.

Чтобы добавить опции в свой плагин, вы должны изменить текущий код. Первое, что нужно сделать — это убедиться, что настройки экрана отображены только на текущей странице:

Этот код только отображает поле опций и кнопку применения, сохранение и загрузку данных нужно настраивать отдельно. WordPress предоставляет фильтр под названием set-screen-option, который позаботится об этом:

Настройки сохранены в таблице usermeta в базе данных, так у каждого пользователя есть свои настройки. Чтобы найти настройки и установить отображение таблицы в соответствии с ними, метод prepare_items должен быть изменён:

Вместо того, чтобы просто установить число, мы загружаем значение, определённое пользователем. Если пользователь не изменил значение, в базе данных такая опция не сохранится, и будет использовано значение по умолчанию.

Добавление переключателей для скрытия/отображения столбцов доступно в WordPress автоматически. Вам просто нужно убедиться, что экземпляр вашего произвольного класса создан раньше, чем отображена панель настроек экрана, так чтобы родительский класс мог найти имена столбцов. Поэтому соответствующий класс перемещаем в метод add_options():

Выбор пользователя автоматически сохраняется с помощью Ajax функций. Однако вы должны сами позаботиться о том, чтобы столбцы были скрыты, если страница была первоначально загружена. Метод get_column_info() возвращает все, скрытые и сортируемые таблицы. В методе prepare_items() вместо

теперь

и столбцы установлены согласно опциям экрана.

Следует избегать использование некоторых строк, таких как следующие ключевые имена, т.к. они обрабатываются WordPress отдельно:

Так ваша таблица всё ещё будет работать, но вы не сможете показать/скрыть столбцы.

Стили таблицы

Сейчас у таблицы стандартные стили WordPress. Чтобы это исправить, вам нужно адаптировать классы CSS, которые были автоматически применены к каждому столбцу. Название класса состоит из строки «column-» и ключевого имени массива $columns, например «column-isbn» или «column-author». В качестве примера мы переопределим ширину столбцов (для простоты, стили прописаны непосредственно в HTML разделе head):

Другие настройки

Если в списке нет никаких элементов, отображается стандартное сообщение «No items found.». Если вы хотите изменить это сообщение, вы можете переписать метод no_items():

Скачайте готовый пример WP_List_Table Просмотрите код онлайн


3 комментарий на “WP_List_Table – пошаговое руководство

  1. Где конструктор класса? Где описание его параметров? Это я только начала читать!!!

    Thumb up 0 Thumb down 0

Оставить комментарий