Поиск по значениям групп фильтров mFilter2

Если нужно вывести поиск в группах фильтров компонента mFilter2 в Modx и иметь возможность использовать поиск только в тех группах, где это нужно к примеру в группе фильтра "Страны" где зачастую используется много значений. Как вариант реализовать это можно с помощью данного скрипта, разместив его в шаблон где вызывается mFilter2:

$(document).ready(initMYF);

function initMYF() {
    objMYF.initFunction();
}
var objMYF = {
    initFunction: function() {
        objMYF.setWrappers();
    },
    setWrappers: function(arrOpt = []) {
        my_form_filter_css_id = "#mse2_filters";
        my_container_filter_el = "fieldset";
        //--search block
        var my_addsearch = "1"; // Минимальное количество символов в поисковом запросе.
        var my_list_css_id_searchArr = ["mse2_resource|parent", "mse2_resource|createdon-month"]; // id блока fieldset в которых нужно вывести форму поиска.
        var my_tag_title = "h4";
        my_search_numsymbols = "1";
        $(my_form_filter_css_id + " " + my_container_filter_el).each(function() {
            if (my_addsearch != 0) {
                if ($.inArray($(this).prop("id"), my_list_css_id_searchArr) != -1) {
                    var htmCon = "<div class='searchBlock'><i class='fa fa-search' aria-hidden='true'></i><input class='form-control' type='text'  data-name='searchField' placeholder='Поиск по фильтрам'/></div>";
                    $(this).find($(my_tag_title)).after(htmCon);
                }
                jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
                    return function(elem) {
                        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
                    };
                });
                $(document).on('keyup', "input[data-name='searchField']", function() {
                    console.log($(this).val());
                    if ($(this).val().length >= my_search_numsymbols) {
                        $(this).parents(my_container_filter_el).find("label").css({
                            "display": "block"
                        });
                        $(this).parents(my_container_filter_el).find("label").addClass("hide_filters");
                        $(this).parents(my_container_filter_el).find("label:Contains('" + $(this).val() + "')").removeClass("hide_filters").addClass("visible_filter");
                        $(".hide_filters").fadeOut(5);
                    } else if ($(this).val().length < my_search_numsymbols) {
                        $(this).parents(my_container_filter_el).find("label").removeClass("hide_filters").fadeIn(5);
                    }
                });
            }
        });
    }
}
Чтобы вывести форму поиска в нужном блоке фильтра, в параметрах скрипта нужно указать "id" блока. В mFilter2 каждый блок группы фильтров имеет тег "fieldset" в нём есть уникальный индификатор "id" который можно посмотреть в консоле браузера: В параметре my_list_css_id_searchArr перечисляем id тех блоков в которых вам нужно вывести форму поиска.
var my_list_css_id_searchArr = ["id блока 1", "id блока 2"];
Просто пример и результат:
[[!mFilter2?
    &filters=`
        parent:categories,
        createdon:year,
        createdon:month
       `
]]
Результат:
Изображения:

Ответы: 3

Аноним
Аноним
Александр спасибо Вам за этот ресурс. Постоянно им пользуюсь. Вы не могли бы направить в нужное русло — никак не могу сообразить как сделать фильтры по диапазону дат для товаров категории через mFilter2
Аноним
Аноним
Привет, Александр! Отличная инструкция, будем использовать.
Аноним
Аноним
Александр, здравствуйте! Спасибо за отзыв.