Сегодня я расскажу как сделать фильтр товаров на php . В фильтре пользователь сможет выбирать множество параметров для сортировки и получать в ответ сгенерированный SQL запрос с результатами поиска. Итак, чтобы все работало на нужны 3 вещи:

База данных SQL с информацией для тестов

PHP скрипт для обработки запроса и вывода результатов на страницу

HTML форма фильтра товаров с полями сортировки

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

За основу взята рабочая копия базы данных из моей самописной CMS и заполнена информацией о мобильных телефонах, их параметрах, ценах и т.д. в целях обучения. В этом уроке по созданию фильтра товаров на php мы будем использовать только 4 таблицы из базы:

• items - артикул товара, название товара, наличие, цена обычная и цена по скидке
• attribute_vendor - аттрибут "производитель" (Samsung, Lenovo, HTC и т.д.)
• group_attribute_vendor - группа атрибутов содержит пары значений "код товара-код производителя"
• item_photo - для 1 товара может быть 2 и более фотографии, поэтому тут я записываю информацию о коде товара и соответствующих ему фотографиях. Для основной фотографии ставлю 1 в поле item_photo_main.

1. HTML код формы фильтра товаров:

• Цена:
  • Цена от:
  • Цена до:
• Производитель:
  • Samsung
  • Lenovo
  • Sony
  • Asus
  • HTC
• В наличии
• Акционная цена

2. PHP код фильтра товаров, который создает итоговый SQL запрос для поиска: function addFilterCondition($where, $add, $and = true) { if ($where) { if ($and) $where .= " AND $add"; else $where .= " OR $add"; } else $where = $add; return $where; } function getMainQuery() { return "SELECT i.item_id, i.item_number, i.item_title, i.stock_id, i.item_price, i.item_discount, ph.item_photo, ph.item_photo_main, ph.item_photo_alt, ph.item_photo_title, vendors.attribute_id FROM (SELECT item_id, item_number, item_title, stock_id, item_price, item_discount FROM items) AS i LEFT JOIN item_photo AS ph ON i.item_number = ph.item_number LEFT JOIN group_attribute_vendor AS vendors ON vendors.item_number = i.item_number"; } if (!empty($_POST["filter"])) { $sql = getMainQuery(); $where = ""; if ($_POST["price_start"]) { $where = addFilterCondition($where, "i.item_price >= "" . htmlspecialchars($_POST["price_start"])) . """; } if ($_POST["price_end"]) { $where = addFilterCondition($where, "i.item_price 0"); } $second = "ph.item_photo_main=0 ORDER BY i.item_id DESC"; if ($where) { $sql .= " WHERE $where AND " . $second; } else { $sql .= " WHERE " . $second; } } echo "Получили такой SQL запрос:" . $sql; $stmt = $pdo->prepare($sql); $stmt->execute($ids); $resultsCount = $stmt->rowCount(); echo "В результате найдено: {$resultsCount} строк ";

Единственный нюанс был в том, чтобы отправить значения с запятыми в PDO. Я имею ввиду передачу условия IN () для выбора нескольких производителей товара одновременно. Тут помогли запросы в Gogole такого формата: PHP PDO: How to call stored procedure to pass comma separated string to parameter Passing values to MySQL IN operation in PDO prepared statement bind an array to an IN() condition .

Одним из найденных способов решения в данном примере я и воспользовался:

$ids = $_POST["vendors"]; $inQuery = implode(",", array_fill(0, count($ids), "?")); $stmt = $db->prepare("SELECT * FROM table WHERE id IN(" . $inQuery . ")");

1. Фильтрация и сортировка блоков «Quicksand»

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

Это решение отлично подойдет для реализации фильтров в интернет-магазинах или для оформления страниц-портфолио.

3. jQuery плагин jCoverflip

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

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

5. jQuery плагин «MobilySelect»

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

6. jQuery HTML5 портфолио

Реализация красивого портфолио с помощью jQuery и HTML5. Фишка портфолио в реализованном фильтре. Различные работы в портфолио отображаются в зависимости от выбранной категории.

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

Для начала должна быть таблица, по которой будет идти поиск. Пусть это будет упрощённая таблица для ноутбуков:

• id - уникальный идентификатор.
• price - цена.
• manufacturer - производитель.
• wi-fi - наличие Wi-Fi .

Теперь разберём форму поиска:

Цена от:	рублей
Цена до:	рублей
Производитель
Apple
Acer
ASUS
Наличие Wi-Fi:

Думаю, здесь, всё прозрачно. Единственное, что обратите внимание на manufacturers . Квадратные скобки означают, что в скрипт попадёт массив со всеми значениями, выбранными пользователем. Чтобы лучше это понять, просто выведите print_r($_POST) , тогда Вы всё поймёте.

Теперь разберём скрипт. В целях упрощения скрипта я не стал его усложнять скриптами, отвечающими за безопасность, и ограничился функцией htmlspecialchars() . Однако, в реальности, обязательно надо проверять всё, что приходит от пользователя, используя, например, регулярные выражения и/или встроенные функции проверки переменных на их значение.

Главная задача скрипта - "собрать" SQL-запрос на основе того, что пришло от пользователя :