Не могу настроить зависимые фильтры в mFilter2

Всем здравствуйте!

Не могу настроить зависимые фильтры в mFilter2
Документацию по mSearch2 читал, там прям скрипт готовый есть.
docs.modx.pro/komponentyi/msearch2/tipovyie-resheniya/zavisimyie-filtryi

И он отлично работает, только одно НО, при условии — марка: Ford, модель Ford Galaxy (то есть название модели включает в себя марку).

А у меня в базе модель просто Galaxy (без Ford) и базу быстро не поменяешь 35 тыс товаров.
Хоть js я и начал учить, но не получается пока, не хватает знаний), я так понимаю data-атирибуты нужны в модели?

Вот такой вопрос собственно, может ли кто-то помочь, может у кого-то есть наработки такие, код или встречался с похожей ситуацией?
Буду признателен за помощь, спасибо!

Дмитрий

28 июля 2022, 23:57

1 269

Комментарии: 13

Артур Шевченко

29 июля 2022, 00:19

Думаю ntt нужно переписать вот эту функцию

// Функция включения моделей
    enableModel: function() {
        // Получаем марку автомобиля
        var marka = this.marka.find(':selected').text().replace(/\(.*?\)$/, '').replace(/\s+$/, '');
        var re = new RegExp('^' + marka);
        // Пробегаем по всем моделям и проверяем имя
        $this.model.find('option').each(function() {
            var $this = $(this);
            // Имя не совпадает - нужно отключить эту модель
            if (!$this.text().match(re) && $this.prop('value') != '') {
                $this.attr('disabled', true);
                $this.hide();
            }
            // В противном случае - включить
            else {
                $this.attr('disabled', false);
                $this.show();
            }
        });
        // И показываем весь блок с моделями
        $this.model.show();
    },
}

тут проверяется есть ли в названии модели марка

if (!$this.text().match(re) && $this.prop('value') != '')

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

Дмитрий

29 июля 2022, 01:01

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

Константин

29 июля 2022, 09:38

Всем привет, присоединяюсь к вопросу. Такая же ситуация, есть марка Kia, а в модели название марки отсутствует и дублировать название марки в модели как-то не красиво. Как в таком случае найти решение?

Роман

29 июля 2022, 09:43

У вас нет привязки, поэтому нужно либо сделать привязку.
Вроде такой модели:

var phoneModels = {
  "Apple": ["iPhone 13 Pro Max", "iPhone 13 Pro", "iPhone 13", "iPhone 13 mini", "iPhone XS Max", "iPhone XS", "iPhone 12", "iPhone 12 mini", "iPhone 11", "iPhone SE 2020"],
  "Samsung": ["Galaxy A23 4/64GB KZ", "Galaxy A23 6/128GB KZ", "Galaxy A33 5G 6/128GB KZ", "Galaxy A73 5G 6/128GB KZ", "Galaxy A73 5G 8/256GB KZ", "Galaxy Z Flip3 5G 8/128GB", "Galaxy Z Fold3 5G 12/256GB", "Galaxy Z Fold3 5G 12/256GB", "Galaxy S21 5G 8/128GB", "Galaxy A52 4/128GB", "Galaxy S21 5G 8/128GB", "Galaxy S21 5G 8/256GB", "Galaxy S21 FE 6/128GB", "Galaxy A33 5G 6/128GB KZ", "Galaxy A53 5G 6/128GB KZ", "Galaxy S21 FE 6/128GB", "Galaxy A53 5G 8/256GB KZ", "Galaxy S21 FE 6/128GB KZ", "Galaxy A73 5G 6/128GB KZ", "Galaxy A33 5G 6/128GB KZ", "Galaxy A53 5G 6/128GB KZ", "Galaxy A13 4/64GB KZ", "Galaxy S21 FE 6/128GB", "Galaxy S20 FE G780G 6/128GB", "Galaxy A52 4/128GB", "Galaxy A32 6/128GB AE", "Galaxy S22 8/128GB KZ", "Galaxy A52 4/128GB KZ", "Galaxy A13 4/64GB KZ", "Galaxy A13 4/128GB KZ", "Galaxy A73 5G 6/128GB KZ", "Galaxy A23 4/64GB KZ", "Galaxy A23 6/128GB KZ", "Galaxy A22s 5G 4/64GB", "Galaxy M32 6/128GB", "Galaxy A32 4/64GB"]
};

Дмитрий

02 августа 2022, 17:18

Спасибо за подсказку.

Дмитрий

02 августа 2022, 17:27

В итоге я решил вопрос так.
1) Создал объект с марками и моделями (по наводке Романа, еще раз спасибо!)
Что-то такое:

var carsModelsObject = {
    "Alfa Romeo": {
        "146": [],
        "147": [],
        "156": []    
    },

    "Audi": {
        "80": [],
        "90": [],
        "100": [],
        "A2": [],
        "A3": [],
        "A4": [],
        "A5": [],
        "A6": [],
        "A6 Allroad": [],
        "A8": [],
        "Q2": [],
        "Q3": [],
        "Q5": [],
        "Q7": [],
        "TT": [],
        "V8": [],

    },
// и так далее по всем маркам...
}

2) Далее сам скрипт

<script>
      window.onload = function() {
        var carSel = document.getElementById("msoption|marka_0"); // мои названия опций
        var modelSel = document.getElementById("msoption|model_0"); // мои названия опций
    
        for (var x in carsModelsObject) {
            carSel.options[carSel.options.length] = new Option(x, x);
        }
        carSel.onchange = function() {
    
            modelSel.length = 1;
          //display correct values
          for (var y in carsModelsObject[this.value]) {
            modelSel.options[modelSel.options.length] = new Option(y, y);
          }
        }
      }
    </script>

Может не самое элегантное решение, но решение)
Если кто-то может поделиться своим вариантом, возможно более удачным, буду признателен. Спасибо!

Константин

10 августа 2022, 17:00

Дмитрий добрый вечер, можете подсказать что есть объект для начинающего? Это внешний xml файл, с таким содержимым?

var carsModelsObject = {
    "Alfa Romeo": {
        "146": [],
        "147": [],
        "156": []    
    },

    "Audi": {
        "80": [],
        "90": [],
        "100": [],
        "A2": [],
        "A3": [],
        "A4": [],
        "A5": [],
        "A6": [],
        "A6 Allroad": [],
        "A8": [],
        "Q2": [],
        "Q3": [],
        "Q5": [],
        "Q7": [],
        "TT": [],
        "V8": [],

    },
// и так далее по всем маркам...
}

Если да, то как его использовать, обращаться к нему?
Со скриптом понятно, а что с объектом делать не пойму…
Заранее спасибо, буду очень благодарен.

Николай Савин

10 августа 2022, 19:35

Объект это элемент и термин языка программирования, в данном случае JS. Это массив данных, вот в примере выше как раз, которым можно манипулировать. Источник данных может быть любым. А именно объект в контексте разговора это логический элемент языка. В него можно поместить данные. Данными можно манипулировать. Откуда они берутся — это уже десятый разговор.

Константин

11 августа 2022, 08:47

Спасибо!!! Разобрался) Но почему-то стали дублироваться в фильтре марки и модели: disk.yandex.ru/i/W-3JcFircMkXsg

Вывожу так же, только объект другой:

<script>
var carsModelsObject = {
    "KIA": {
        "Rio 3 QBR (11-17)": [],
        "Rio 4 FB (2017- )": [],
        "Soul 3 SK3 (2019- )": [],
        "Creta 1 GSR (2016-21)":[]
    },

    "Hyundai": {
        "Solaris 1 RBR (10-17)": [],
        "Solaris 2 HCR (2017- )": []
    }
}
</script>
<script>
      window.onload = function() {
        var carSel = document.getElementById("msoption|marka_0"); // мои названия опций
        var modelSel = document.getElementById("msoption|model_0"); // мои названия опций
    
        for (var x in carsModelsObject) {
            carSel.options[carSel.options.length] = new Option(x, x);
        }
        carSel.onchange = function() {
    
            modelSel.length = 1;
          //display correct values
          for (var y in carsModelsObject[this.value]) {
            modelSel.options[modelSel.options.length] = new Option(y, y);
          }
        }
      }
    </script>

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

Корректная строка:

https://rioek.ru/zapchasti/?marka=KIA&model=Soul%203%20SK3%20(2019-%20)

Строка с дублем марки:

https://rioek.ru/zapchasti/?marka=KIA&model=KIA%20Soul%203%20SK3%20(2019-%20)

Дмитрий

11 августа 2022, 22:37

Добрый вечер, а ваши названия в опциях товара точно соответствуют названиям из объекта?
К примеру в объекте "KIA«заглавными, а в свойстве товара случаем не „Kia“?

Константин

12 августа 2022, 09:33

Так точно, скриншот: disk.yandex.ru/i/aat_f5elJpEbrg

Дмитрий

02 сентября 2022, 11:09

Может и поздновато), но тут же тогда отлично подходит скрипт из документации
(так как название модели начинается на выбранную марку)
docs.modx.pro/komponentyi/msearch2/tipovyie-resheniya/zavisimyie-filtryi

Дмитрий

02 сентября 2022, 11:21

Да, согласен. Не заметил сразу, дублируется марка при использовании этого скрипта.

Может кто-то подсказать почему так?

Делал так:
1) Создал объект с марками и моделями

var carsModelsObject = {
    "Alfa Romeo": {
        "146": [],
        "147": [],
        "156": []    
    },

    "Audi": {
        "80": [],
        "90": [],
        "100": [],
        "A2": [],
        "A3": [],
        "A4": [],
        "A5": [],
        "A6": [],
        "A6 Allroad": [],
        "A8": [],
        "Q2": [],
        "Q3": [],
        "Q5": [],
        "Q7": [],
        "TT": [],
        "V8": [],

    },
// и так далее по всем маркам...
}

2) Сам скрипт

<script>
      window.onload = function() {
        var carSel = document.getElementById("msoption|marka_0"); // мои названия опций
        var modelSel = document.getElementById("msoption|model_0"); // мои названия опций
    
        for (var x in carsModelsObject) {
            carSel.options[carSel.options.length] = new Option(x, x);
        }
        carSel.onchange = function() {
    
            modelSel.length = 1;
          //display correct values
          for (var y in carsModelsObject[this.value]) {
            modelSel.options[modelSel.options.length] = new Option(y, y);
          }
        }
      }
    </script>

Скрипт отключаю, дублирование пропадает) Может подскажет кто-то, что в нем не верно?
Спасибо!

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

Не могу настроить зависимые фильтры в mFilter2

Комментарии: 13

Здесь упомянуты