Блог Vaden Pro

Все о самостоятельном создании и продвижении сайтов

Раскрытые фильтры и сортировки в представлениях (views) на Drupal 7

Раздел: 

Раскрытые критерии фильтрации и сортировки

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

Мы уже в ходе работ сталкивались с настройками фильтров и сортировали данные. Однако это мы делали на административном уровне и кроме нас ни кто не может внести какие либо изменение в сортировку.

Теперь пришло время поговорить о том, как сделать фильтр удобным и доступным для пользователя. Одним из способов, который есть в арсенале модуля views, это дополнительная «раскрытая» настройка в фильтрах и сортировках . О них мы и поговорим в данной статье.

Настройка фильтра

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

Выбор отображения

Далее в разделе «критерии фильтрации» добавляем новое поле, по которому мы и гости сайта смогут отсеивать Книги.

Добавить фильтер

В выплывающем окне не забываем выставить раздел «Для», Эти настройки нам нужны только для этой страницы поэтому выставляем «этот page» и находим поле, по которому мы будем сортировать наши материалы.

Я отфильтрую свои материалы по полю «Язык», в котором я заполнял язык оригинала, поэтому ставлю галочку рядом с соответствующим полем. И нажиму применить.

Выбор фильтра

Перед нами появится окно Настройки дополнительных параметров, где мы можем выбрать тип заполнения поля, в виде выпадающего списка или в виде текстового поля, которое автоматически будет предлагать дополнить текст ссылаясь на уже существующие термины. Для нас будет удобен выпадающий список, по этому его мы и выберем.

Способ заполнения

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

Настройка фильтра

Добавляем сортировку

Но чаще всего, кроме отсеивания ненужного для себя материала, пользователь из оставшегося хочет выбрать лучший. А за это на нашем сайте отвечает поле fivestar, которое мы добавим в сортировке.

Добавить сортировку

В окне находим наше рейтинговое поле и отмечаем его.

рейтинг

Проверяем область применения настроек, не забываем что они нам нужны только на этой странице, а в настройках также раскрываем поле оценки и сохраняем настройки.

Настройка рейтинга

У нас добавился новый критерий фильтрации, однако из-за того что он стоит вторым, после (сортировать по дате добавления), друпал сначала отсортирует по дате, а потом по рейтингу. Он считает главным вышестоящий критерий, поэтому для того, что бы сделать фильтрацию по рейтингу fivestar нам надо поставить её вперёд. Для этого нажимаем на треугольник рядом с кнопкой добавить и в выплывающем меню выбираем «изменить порядок»

Изменения порядка

Перед нами откроется окно в котором обычной перестановкой полей мы меняем их порядок, на необходимый нам и нажимаем на кнопку применить.

Порядок

На этом наши настройки практически завершены, поэтому смело сохраняем наше отображение и переходим на главную, что бы увидеть результат нашей работы.

Результат настроек

Как мы видим, мы создали фильтр, к которому имеет доступ не только администратор, а так же и посетитель. Давайте же его проверим.

Результат

Отфильтруем по языку «Английский» , а «Оценка» по возрастанию.

Английский по возрастанию

Изменим порядок «по убыванию»

По убыванию

Поставим язык Французский

Пустое окно

Выводим сообщение

Выбрав пустой фильтр, тот в котором нет ни одной книги, у нас появляется пустое окно, которое крайне не информативно. Что бы этого не было нам надо вернутся в настройку нашего представления. Переходим в расширенные настройки и добавляем новое поле для раздела «Поведение при отсутствии результатов».

Поведение при отсутвии

Поле, которое мы будем добавлять, называется «Глобальный: Текстовое поле». Отмечаем его в списке и переходим в настройки. На этот раз в поле «Для» мы ставим «Все отображения».

Поле для сообщения

В следующем окне мы вписываем наше сообщение в текстовой области. И нажимаем сохранить.

Поле для сообщения

После сохранения представления пользователю который задаст фильтр не имеющий в себе книг, выпадет наше сообщение.

Совпадений нет

Дополнительные настройки фильтра

При помощи представления можно внести некоторые изменения в наш фильтр. Для этого нам надо перейти на страницу редактирования представления с фильтром и в расширенных настройках найти раздел под название «РАСКРЫТАЯ ФОРМА».

Раскрытая форма

Раскрытая форма в блоке

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

Фильтр в блоке

Стили формы раскрытых фильтров

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

Что бы изменить стиль необходимо кликнуть по ссылке «Основное».

Основные

Перед нами откроется окно в котором мы можем изменить наш стиль на «Требуется ввод».

выбор стиля

Текст ссылки будет меняться в зависимости от того какой стиль активен.

Пока что не будем не чего менять и перейдём на настройки этого стиля, нажав на ссылку «настройки».

Настройки

Настройка стиля.

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

Поля смены текста

Поле «Включая кнопку сброс» - если его активировать на нашей форме появится дополнительная кнопка, которая будет обнулять наш фильтр. Также после его активации появиться дополнительная настройка, в которой мы можем ввести свой текст для кнопки.

Кнопка сброса

«Автоматическая отправка» - если поставить галочку на этом чекбоксе, то обновления будут применены автоматически. Если это поле активно то у нас есть выбор выводить кноку применить или нет, однако при активном javascript она будет не нужна.

Авто отправка

Изменение стиля и его настройки

Второй стиль называется «Требуется ввод». Его отличие от «Основное» заключается в том, что на странице не будут показаны материалы, пока не будет выбран один из критериев фильтра.

Стиль

Перейдём в его настройки. В настройках добавилось ещё одно поле «Текст по запросу». По желанию заполняем его своим текстом.

Текст по запросу

Выставим галочки на «Автоматическая отправка» и на « Включая кнопку сброс» и посмотрим, что получилось.

Мы видим, что кнопка применить не выводится, и пока мы не чего не выбрали на странице, вместо материала, выводится наш текст.

Требуется ввод

После внесения изменения страница автоматически обновляется и появляются книги отвечающие нашему запросу.

Фильтр

А после нажатия кнопки сброс, наш фильтр обнуляется.

Требуется ввод

В целом дальнейшая работа лежит за CSS.

Итоги

В своих уроках мы рассмотрели функционал первой необходимости модуля Views. Но это лишь малая часть тех функций, которые перед нами может открыть этот модуль для Drupal.