Настройка фильтра поиска по дополнительным полям от Gameer

Статья неактуальна. У разработчика появилась подробнейшая документация https://lazydev.pro/product/7-dle-filter.html

Всем привет. Постараюсь здесь написать понятную инструкцию по настройке модуля фильтра от Gameer.

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



Разметка фильтра

<form id="searchform"  action="" data-filtertriger=fieldseacrh>
все что здесь внутри — это значения поиска, управляющие кнопки
</form>

Также важно: не надо сразу методом копипаста пихать все в поиск, а потом менять. Лучше аккуратно добавляйте по одной настройке — так не запутаетесь и больше поймете, что к чему.

А теперь подробно по настройке значений поиска.

Значения задаются через различные input, select. Каждое значение имеет 2 обязательных параметра: name и value. 
Name – это место поиска или настройка.
Value – это само значение поиска или значение настройки.

Далее я буду приводить примеры на 

<input type="checkbox">

 - это отмечаемая галочка, и 

 <select></select>

 - это селект или выпадающий список с многими значениями

Например, мы хотим искать по доп полю genre значение боевик, тогда

<input name="genre" value="боевик" type="checkbox"> боевик

или селект

        <select name="genre">
                <option value="боевик">Боевик</option>
        </select>

добавлю еще комедию

<input name="genre" value="боевик" type="checkbox"> боевик
<input name="genre" value="комедия" type="checkbox"> комедия

или

        <select name="genre">
                <option value="боевик">Боевик</option>
                <option value="комедия">комедия</option>
        </select>

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

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

<form id="searchform"  action="">
        <select name="genre">
                <option value="боевик">Боевик</option>
                <option value="комедия">комедия</option>
                <option value="ужасы">ужасы</option>
                <option value="мелодрама">мелодрама</option>
        </select>
<!-- это выпадающий список. Ищем в доп поле genre -->
<input name="cat" value="1" type="checkbox"> фильмы
<input name="cat" value="2" type="checkbox"> мультфильмы
<!-- это галочки. Ищем в категории по ее id  -->
<input type="text" name="from-year" placeholder="год от">
<input type="text" name="to-year" placeholder="год до">
<!-- это текстовые поля для ввода. Ищем год из поля year от и до, а значения будет вводить юзер  -->
<input name="order_by" value="date" type="hidden">
<!-- это сортировка по дате. Скрытое значение  -->
<input type="hidden" name="order" id="order" value="desc"/>   
<!-- это сортировка по убыванию. Скрытое значение &#8594;
        <input type="button" data-fieldsearch="submit" value="Поиск">
        <input type="button" data-fieldsearch="reset" value="Очистить">
<!-- это кнопки  -->
</form>

итак, мы задаем каждую настройку посредством разных input, select — кому как больше нравится, как надо или как удобнее. И задаем им value, name – вот и все.

<input type="checkbox"> - галочка, выбирает одно значение.
<input type="text"> - текстовое поле для ввода
<input type="hidden"> - скрытая или невидимая настройка
<select></select> - выпадающий список, выбор одного значения из списка
<select multiple="multiple"></select> - выпадающий список, но можно выбрать сразу несколько значений из списка

Таблица параметров и значений

Название	name	value	пример value
категория	cat	id категории	3
доп поле	название доп поля на латинице	значение из поля	боевик
диапазон от	from-название доп поля на латинице	значение из поля	1950
диапазон до	to-название доп поля на латинице	значение из поля	2016
порядок по	order_by	date - по дате новости title - по названию новости comm_num - по количеству комментариев новости news_read - по количеству просмотров новости autor - по автору новости rating - по рейтингу новости	date
порядок сортировки	order	desc - убыванию asc - по возрастанию	desc
поиск по названию новости	l.title	обычно сам юзер набирает, value отсутствует
поиск по тегам новостей	l.tags	тег	зомби

еще один пример с шаблоном filmax

<div class="filter-box">
                    <div class="fb-sect-name">Что вы ищете?</div>
                    <div class="fb-sect flex-row flex-2 fb-checks">
                        <div class="fb-check">
                            <input id="film" name="cat" value="1" type="checkbox">
                            <label for="film">Фильмы </label>
                        </div>
                        <div class="fb-check">
                            <input id="ser" name="cat" value="2" type="checkbox">
                            <label for="ser">Сериалы </label>
                        </div>
                    </div>
<!-- Ищем в категории по ее id 1 или 2. -->
                    <div class="fb-sect-name">Выберите жанр</div>
                    <div class="fb-sect fb-sel">
                        <select name="genre" multiple data-placeholder="Выберите жанр">
                            <option value="боевик">Боевик</option>
                            <option value="комедия">Комедия</option>
                            <option value="ужасы">Ужасы</option>
                            <option value="триллер">Триллер</option>
                            <option value="мелодрама">Мелодрама</option>
                        </select>
                    </div>
<!-- Ищем в доп поле genre указанные значения. это список с возможностью выбрать одновременно несколько значений -->
                    <div class="fb-sect-name">Выбрать что-то</div>
                    <div class="fb-sect fb-sel">
                        <select name="voice" data-placeholder="Выбрать озвучку">
                            <option></option>
                            <option value="den904">Пункт 1</option>
                            <option value="колобок">Пункт 2</option>
                            <option value="хихидок">Пункт 3</option>
                        </select>
                    </div>
<!-- Ищем в доп поле voice указанные значения. это список с возможностью выбрать только одно значение -->
                    <div class="fb-sect-name">Выбрать диапазон</div>
                    <div class="fb-sect flex-row flex-2">
                        <select name="from-year" data-placeholder="от">
                            <option></option>
                            <option value="1985">Пункт 1</option>
                            <option value="1990">Пункт 2</option>
                            <option value="1995">Пункт 3</option>
                        </select>
                        <select name="to-year" data-placeholder="до">
                            <option></option>
                            <option value="2005">Пункт 1</option>
                            <option value="2010">Пункт 2</option>
                            <option value="2020">Пункт 3</option>
                        </select>
                    </div>
<!-- Выбор диапазона от и до в доп поле year через список селект  -->
                    <div class="fb-sect-name">Выбрать диапазон слайдером</div>
                    <div class="fb-sect">
                        <input type="text" name="r-year" id="year" />
                    </div>
<!-- А это выбор диапазона доп поля year с помощью плагина слайдера, встроенного в filmax.  Сам размах диапазона мы указываем в js/filter-xf.js  -->
                    <div class="fb-sect">
                        <input name="l.title" type="text" placeholder="Введите название новости" />
                    </div>
<!-- Поле для ввода. Ищет в названии новости -->
                    <div class="fb-submit flex-row flex-2">
                        <input type="button" data-fieldsearch="submit" value="Поиск">
                        <input type="button" data-fieldsearch="reset" value="Очистить">
                    </div>
 </div>