Skip to content
  1. Компоненты
  2. mSearch2
  3. Сниппеты
  4. mFilter2

mFilter2 ​

Сниппет реализует вторую половину компонента - фильтрацию найденных результатов.

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

mFilter2

Параметры ​

НазваниеПо умолчаниюОписание
&paginatorpdoPageСниппет для постраничной навигации, по умолчанию pdoPage. Вы можете указать набор параметров для него: &paginator=`pdoPage@myParams`.
&elementmSearch2Сниппет, который будет вызываться для вывода результатов работы, по умолчанию - mSearch2. Вы можете указать набор параметров для него: &element=`mSearch2@myParams`.
&sortСписок полей ресурса для сортировки. Указывается в формате «таблица|поле:направление». Можно указывать несколько полей через запятую, например: «resource|publishedon:desc,ms|price:asc».
&filtersresource|parent:parentsСписок фильтров ресурсов, через запятую. Указывается в формате «таблица|поле:метод».
&aliasesСписок псевдонимов для фильтров, которые будут использованы в URL фильтра, через запятую. Указывается в формате "таблица|поле==псевдоним". Например: "resource|parent==category".
&showEmptyFilterstrueПоказывать фильтры всего с одним значением.
&resourcesСписок ресурсов для вывода, через запятую. Этот список будет обработан другими параметрами, такими как &parents, &showDeleted, &showHidden и &showUnpublished.
&parentsСписок категорий, через запятую, для ограничения вывода результатов.
&depth10Глубина поиска ресурсов от каждого родителя.
&tplOutertpl.mFilter2.outerЧанк оформления всего блока фильтров и результатов.
&tplFilter.outer.defaulttpl.mFilter2.filter.outerСтандартный чанк оформления одной группы фильтров.
&tplFilter.row.defaulttpl.mFilter2.filter.checkboxСтандартный чанк оформления одного фильтра в группе. По умолчанию выводится как checkbox.
&showHiddentrueПоказывать ресурсы, скрытые в меню.
&showDeletedfalseПоказывать удалённые ресурсы.
&showUnpublishedfalseПоказывать неопубликованные товары.
&hideContainersfalseСкрывать ресурсы-контейнеры.
&showLogfalseПоказывать дополнительную информацию о работе сниппета. Только для авторизованных в контексте «mgr».
&suggestions1Этот параметр включает предположительное количество результатов, которое показывается возле каждого фильтра. Отключите, если вы недовольны скоростью фильтрации.
&suggestionsMaxFilters200Максимальное количество операций фильтрации (не самих фильтров), для которых работают предварительные результаты. Если операций требуется больше - suggestions отключатся.
&suggestionsMaxResults1000Максимальное количество ресурсов, для которых работают предварительные результаты. Если ресурсов будет больше - suggestions отключатся.
&suggestionsRadioСписок фильтров через запятую, для которых возможен выбор только одного значения, например, элементы radio и select. Предсказания этих групп фильтров не суммируются между собой. Например: «resource|class_key,ms|new»
&suggestionsSliderstrueАктивирует работу предположительных результатов со слайдерами, увеличивая при этом общее количество фильтраций.
&toPlaceholdersЕсли не пусто, mFilter2 сохранит все данные в плейсхолдеры: [[+filters]], [[+results]] и [[+total]] с префиксом, указанным в этом параметре. Например, если вы укажете &toPlaceholders=`my.`, то получите: [[+my.filters]], [[+my.results]] и [[+my.total]]
&toSeparatePlaceholdersРаботает так же как и &toPlaceholders, только в раздельные плейсхолдеры попадает еще и filters. Например, если вы укажете &toSeparatePlaceholders=`my.` и &filters=`tv|test,resource|pagetitle` то получите плейсхолдеры [[+my.results]], [[+my.total]], [[+my.tv|test]] и [[+my.resource|pagetitle]].
&filter_delimeter|Разделитель кодового имени таблицы и поля фильтра.
&method_delimeter:Разделитель полного имени фильтра и метода его обработки.
&values_delimeter,Разделитель значений фильтров в адресной строке сайта.
&tplsСписок чанков для оформления строк, через запятую. Вы можете переключать их указанием в $_REQUEST параметра &tpl. 0 - это чанк по умолчанию, а дальше по порядку. Например: &tpls=`default,chunk1,chunk2`, для вывода товаров чанком "chunk1", нужно прислать в запросе $_REQUEST[tpl] = 1.
&forceSearchfalseОбязательный поиск для вывода результатов. Если нет поискового запроса - ничего не выводится.
&fieldsСписок проиндексированных полей ресурса, через запятую, в которых нужно искать. Вы можете также указать вес для каждого поля, через запятую: &fields=`pagetitle:5,content:3,comment:1`. По умолчанию используется системная настройка mse2_index_fields.
&onlyIndexfalseВключить режим поиска только по индексу слов, и отключить дополнительные результаты, найденные простым поиском через LIKE.
&showSearchLogfalseПоказывать подробную информацию о начислении баллов поиска ресурсам при включенном &showLog.
&sortAliasesJSON массив с псевдонимами классов для сортировки. Подробности ниже.
&filterOptionsJSON строка с переменными для javascript фильтра. Подробности ниже.
&ajaxModedefaultРежим ajax пагинации: default, scroll или button. Работает аналогично pdoPage, только без параметра &ajaxHistory.

Принцип работы ​

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

  • Прямое указание параметров, таких как &parents, &resources, &showHidden и т.д. Они будут переданы в сниппет, указанный в &element и он вернёт нужные id.
  • Поиск по алгоритму mSearch2, если в $_REQUEST[&queryVar] что-то есть. При этом, найденные id также пройдут проверку указанными параметрами.

Затем сниппет смотрит настройки фильтров и генерирует данные для них. После чего сохраняет настройки в сессию (для ajax запросов) и выводит оформленные чанки.

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

Скрипты и стили ​

При работе mFilter2 регистрируются скрипты и стили, указанные в системных настройках:

  • mse2_frontend_js - стандартный javascript, по умолчанию /assets/components/msearch2/js/web/default.js
  • mse2_frontend_css - стандартные css стили оформления, по умолчанию /assets/components/msearch2/css/web/default.css

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

Также вы можете менять переменные стандартного фильтра, указав их в виде JSON строки в параметре &filterOptions:

modx
[[!mFilter2?
  &parents=`0`
  ...
  &filterOptions=`{
    "pagination": "#mse2_pagination",
    "selected_values_delimeter": ", "
  }`
]]

Они заменят переменные объекта mSearch2.options javascript фильтра на фронтенде.

Например, вот так можно отключить автоматическую отправку формы с фильтрами при изменении:

modx
&filterOptions=`{"autoLoad":0}`

Тогда в форме по умолчанию появится кнопка "Отправить" и нужно будет нажимать на неё.

Особенности ​

  • Для правильной работы необходимо, чтобы все элементы фильтра располагались в одном блоке с #mse2_mfilter. Именно так прописано с стандартном чанке tpl.mFilter2.outer.
  • Скрипт работает через Ajax, сохраняя при этом параметры с адресной строке через HistoryAPI. То есть, у вас всегда есть прямые рабочие ссылки на состояние фильтров.
  • Для реализации цифровых слайдеров скрипт использует jQueryUI.slider, который подключается автоматически, если нужен.
  • По умолчанию всё оформление рассчитано на Bootstrap 3.
  • Стандартная комплектация рассчитана так, чтобы работать при минимальном вызове [[!mFilter2]] и установленном Bootstrap 3.

Если у вас что-то "сломалось", после того, как вы изменили чанк - смотрите, что именно вы изменили.

Особенности

Чанки и оформление ​

У mFilter2 есть один основной чанк, куда выводятся все результаты его работы, с основными плейсхолдерами: [[+filters]] и [[+results]].

За результаты отвечают два сниппета: по умолчанию pdoPage, который запускает mSearch2 для вывода собственно строчек с документами. Вы можете указать и другие сниппеты, например getPage и msProducts:

modx
[[!mFilter2?
  &paginator=`getPage`
  &element=`mSearch2`
]]

Для каждого фильтра можно указать 2 собственных чанка:

  • &tplFilter.outer.таблица|поле=tpl.mFilter2.filter.outer - чанк-обертка, в который вставляются строки с фильтрами (плейсхолдер [[+rows]]).
  • &tplFilter.row.таблица|поле=tpl.mFilter2.filter.checkbox - чанк для оформления одного параметра фильтра, по умолчанию - это checkbox. В комплекте есть еще и чанк для чисел - его нужно указать самостоятельно.

Например, вызов слайдера для цены товара:

modx
[[!mFilter2?
  &class=`msProduct`
  &element=`msProducts`
  &parents=`0`
  &filters=`
    ms|price:number
  `
  &tplFilter.outer.ms|price=`tpl.mFilter2.filter.slider`
  &tplFilter.row.ms|price=`tpl.mFilter2.filter.number`
]]

А вот вывод родителей документов в элементе select:

modx
[[!mFilter2?
  &parents=`0`
  &filters=`
    resource|parent:parents
  `
  &tplFilter.outer.resource|parent=`tpl.mFilter2.filter.select`
  &tplFilter.row.resource|parent=`tpl.mFilter2.filter.option`
  &suggestionsRadio=`resource|parent`
]]

Указание поля select в &suggestionsRadio активирует правильную работу предсказаний с этим фильтром. Блок select даёт выбирать только одно значение, поэтому у соседних значений не должно быть плюсиков перед предсказаниями.

Таким образом, для каждого параметра фильтра можно указать собственные чанки оформления, а если они не указаны - будут использоваться стандартные.

Фильтры ​

Построение фильтров указывается через один параметр &filters, в формате кодовое_имя_таблицы/поле:фильтр. За один раз можно указать сколько угодно фильтров через запятую.

Соотношение реальных таблиц и кодовых имён:

  • resource (modResource) - выборка полей ресурса, таких как pagetitle, longtitle и др.
  • tv (modTemplateVar) - выборка ТВ параметров.
  • ms (msProductData) - выборка полей товара miniShop2, таких как price, article, weight и др.
  • msoption (msProductOption) - выборка опций товаров miniShop2, таких как size, color, tags и др.
  • msvendor (msVendor) - выборка свойств производителя товара, таких как title, country, phone и др.

Если вы не указываете кодовое имя таблицы, то будет использовано resource. А если вы не указываете фильтр, то будет использован default.

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

Пример фильтров в работе:

modx
[[!mFilter2?
  &filters=`
    parent:grandparents,
    createdon:year,
    createdon:month,
    tv|radio:boolean,
    createdby:fullname
  `
]]

Фильтры

В комплекте с mFilter2 идёт несколько стандартных методов фильтрации, которые позволяют сделать вывод фильтров более приятным.

default ​

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

number ​

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

modx
[[!mFilter2?
  &filters=`
    template:number
  `
  &tplFilter.outer.resource|template=`tpl.mFilter2.filter.slider`
  &tplFilter.row.resource|template=`tpl.mFilter2.filter.number`
]]

number

boolean ​

Фильтр для вывода параметров да\нет. Например, опубликован ли ресурс, скрыт в меню, доступен для поиска и т.д. Если не указать фильтр boolean у таких полей, то вы получите 0 и 1 в значениях. А если указать - то "да" и "нет".

modx
[[!mFilter2?
  &filters=`
    isfolder:boolean
  `
]]

boolean

parents, categories и grandparents ​

Следующие три фильтра применяются только к полю parent ресурса.

Parents выводит имена двух родителей, через разделитель. Он включен по умолчанию.

modx
[[!mFilter2?
  &filters=`
    parent:parents
  `
]]

parents, categories и grandparents

Categories выводит имя непосредственного родителя.

modx
[[!mFilter2?
  &filters=`
    parent:categories
  `
]]

Categories

Grandparents выводит имена родителей-дедушек и предназначен для больших каталогов. Если "дедушки" нет, то будет выведен непосредственный родитель.

modx
[[!mFilter2?
  &filters=`
    parent:grandparents
  `
]]

Grandparents

vendors ​

Фильтр для вывода имён производителей товаров miniShop2. Применяется только к полю vendor таблицы ms.

modx
[[!mFilter2?
  &where=`{"class_key":"msProduct"}`
  &filters=`
    ms|vendor:vendors
  `
]]

vendors

fullname ​

Этот фильтр выводит полное имя пользователя. Может применяться к любому полю, содержащему id юзера.

modx
[[!mFilter2?
  &filters=`
    createdby:fullname
  `
]]

fullname

year ​

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

modx
[[!mFilter2?
  &filters=`
    createdon:year
  `
]]

year

month ​

Этот фильтр применяется к полям с датой и выводит месяц прописью, подставляя его название из словаря компонента.

day ​

Этот фильтр применяется к полям с датой и выводит день.

Псевдонимы фильтров ​

В последних версиях дополнения введена специальная система псевдонимов для фильтров, чтобы сделать их использование более удобным.

Вы можете указать список замены длинных названий фильтров на более короткие и понятные. Например:

modx
[[!mFilter2?
  &parents=`0`
  &element=`msProducts`
  &aliases=`
    ms|price==price,
    resource|parent==parent,
  `
  &filters=`
    ms|price:number,
    parent:parents,
    parent:categories,
  `
  &class=`msProduct`
  &tplFilter.outer.price=`tpl.mFilter2.filter.slider`
  &tplFilter.row.price=`tpl.mFilter2.filter.number`
]]

В результате, url будут вот такие:

site.com/mfilter2?price=102,750&parent=10,12,15

Обратите внимание, что указание псевдонимов влияет и на указание параметров шаблонов. То есть, если для ms|price указан псевдоним, то и чанк нужно указывать как &tplFilter.row.price, а не &tplFilter.row.ms|price.

modx
&filters=`
  resource|parent:categories,
  resource|parent:grandparents,
`

Если какое-то поле указано 2 и более раз, то его имя прописывается как поле-фильтр и получается parent-categories и parent-grandparents.

Соответственно, псевдонимы должны быть такими:

modx
&aliases=`
  resource|parent-categories==categories,
  resource|parent-grandparents==grandparents,
`

Ну а чанки указываются уже по псевдониму:

modx
&tplFilter.row.categories=`tpl.mFilter2.filter.checkbox1`
&tplFilter.row.grandparents=`tpl.mFilter2.filter.checkbox2`

Предварительные результаты ​

Предварительные результаты - это маленькие циферки рядом с каждым фильтром, которые показывают, сколько вы получите результатов, если кликните на него.

Предварительные результаты

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

То есть, у вас может быть несколько десятков (сотен, тысяч) дополнительных фильтраций. Зачем это нужно?

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

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

Поэтому она отключается автоматически для больших каталогов регулируемыми параметрами &suggestionsMaxFilters и &suggestionsMaxResults. Также вы можете полностью отключить её общим параметром

modx
&suggestions=`0`

При активации этой опции вы получите максимальную скорость, но циферки рядом с фильтром пропадут.

Сортировка результатов ​

mFilter2 умеет сортировать сразу по нескольким полям таблицы.

Формат указания параметра &sort очень похож на работу &filters:

modx
&sort=`
  resource|publishedon:asc,
  resource|createdby:desc
`

Тут нужно знать следующее: в зависимости от используемого сниппета вывода результатов, псевдонимы базы данных могут отличаться. Например в mSearch2 ресурсы джоинятся под псевдонимом modResource, а в msProducts - как msProduct.

Поэтому при работе с msProducts нужно указывать вот так:

modx
&sort=`
  ms_product|publishedon:asc,
  ms_product|createdby:desc,
  ms|price:asc,
  ms_vendor|name:desc
`

В классе фильтров за эту логику отвечает метод getSortFields(), который вы можете изменить, как и все остальные.

По умолчанию заданы вот такие соответствия для псевдонимов таблиц:

  • ms → Data
  • ms_product → msProduct
  • ms_vendor → Vendor
  • tv → TV
  • resource → modResource

Вот что сниппет получит при обработке параметров из последнего примера:

sql
`msProduct`.`publishedon` ASC, `msProduct`.`createdby` DESC, `Data`.`price` ASC, `Vendor`.`name` DESC

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

Если вам не хватает встроенных псевдонимов, вы можете добавить свои собственные через параметр &sortAliases. Например, для фильтрации тикетов:

modx
[[!mFilter2?
  &parents=`0`
  &class=`Ticket`
  &element=`getTickets`
  &sortAliases=`{"ticket":"Ticket"}`
  &sort=`ticket|createdon:desc,ticket|pagetitle:asc`
  &showLog=`1`
]]

Еще пример - сортировка по опции товара miniShop2:

modx
[[!mFilter2?
  &parents=`0`
  &element=`msProducts`
  &leftJoin=`{
    "Test1": {
      "class": "msProductOption",
      "on": "Test1.key = 'test1' and Test1.product_id = msProduct.id"
    }
  }`
  &sortAliases=`{"test1":"Test1"}`
  &aliases=`test1|value==test1`
  &sort=`test1:desc`
]]

Присоединяем опцию test1, добавляем для этой таблицы псевдоним и сортируем по значению присоединённой опции.

Ссылка для сортировки в чанке tpl.mFilter2.outer в данном случае должна быть примерно такой:

modx
<a href="#" class="sort [[+mse2_sort:is=``:then=`active`]]"
  data-sort="test1"
  data-dir="[[+mse2_sort:is=``:then=`desc`]]"
  data-default="desc">Test1 <span></span></a>

Обратите внимание, что указание псевдонима в &aliases даёт нам возможность сортировать по test1, вместо test1|value.

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

Javascript ​

Вся работа фильтров обеспечивается скриптом default.js, который идёт в комплекте. Путь к нему указывается в системной настройке mse2_frontend_js, так что, если вы захотите внести изменения, просто переименуйте этот файл и укажите новое название в настройке - чтобы при обновлении дополнения он не был перезаписан.

Все методы находятся в одном объекте mSearch2. Программно отправить форму, например, можно вот так:

js
mSearch2.submit();

А сбросить значения так:

js
mSearch2.reset();

При обновлении фильтров срабатывает событие mse2_load:

js
$(document).on('mse2_load', function (e, data) {
  console.log(e, data);
});

Вы можете использовать это событие для дополнительной обработки значений фильтра.

Уменьшаем прозрачность карточек товара, в начале фильтрации и делаем не прозрачными после фильтрации

fenom
{$_modx->regClientScript('
  <script>
    mSearch2.defaultBeforeLoad = mSearch2.beforeLoad;
    mSearch2.defaultAfterLoad = mSearch2.afterLoad;

    mSearch2.beforeLoad = function () {
      mSearch2.defaultBeforeLoad();
      this.filters.css({
        opacity: .5,
        pointerEvents: "none",
      });
    };

    mSearch2.afterLoad = function () {
      mSearch2.defaultAfterLoad();
      this.filters.css({
        opacity: 1,
        pointerEvents: "auto",
      });
    };
  </script>
', true)}

Лексиконы ​

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

Лексиконы - 1

Лексиконы - 2