[СДЕЛАЙ САМ] Поиск на сайте по-быстрому

Данное решение не является учебным и рекомендуется к использованию только на собственных проектах, с целью освоения работы с api modx. Для изучения лучших практик, анализируйте код дополнений с сайта https://modstore.pro/

<div class="container">
        <form class="row mt-lg-5 jsSearchForm">
            <input type="hidden" name="action" value="search">
            <input type="hidden" name="tpl" value="@FILE chunks/blocks/service-item.html">
            <div class="col-9">
                <label class="label-text par">
                    <input type="text" name="query" class="input" placeholder="Например, купить в 1 клик">
                </label>
            </div>
            <div class="col-3">
                <button class="btn btn-orange btn-cart" type="submit">
                    <i class="fa fa-search"></i>
                </button>
            </div>
            <div class="col-12">
                <span class="text-red par jsError"><!-- сюда будем вставлять текст ошибки --></span>
            </div>
        </form>
    </div>
<div class="container mt-lg-4 mt-3" id="productList">
<!-- сюда будем вставлять результаты поиска -->
</div>

// вешаем обработчик на форму поиска 
 document.querySelector('.jsSearchForm').addEventListener('submit', function (e) {
     e.preventDefault();
     let formData = new FormData(e.target.closest('form'));
     sendAjax(formData);
});

// отправляем ajax
function sendAjax(params) {
    // Создаем экземпляр класса XMLHttpRequest
    const request = new XMLHttpRequest();
        
     // Указываем путь до файла на сервере, который будет обрабатывать наш запрос
    const url = document.location.href;

     // Указываем что соединение у нас будет POST
    request.open('POST', url);

    request.responseType = 'json'; // ответ должен быть в формате json
    
    // обрабатываем ответ сервера
    request.addEventListener("readystatechange", () => {
            if (request.readyState === 4 && request.status === 200) {
                //console.log(request.response);
                // показываем результаты поиска
                if(document.getElementById('productList') && request.response.products){
                    document.getElementById('productList').innerHTML = request.response.products;
                } 
                // выводим ошибки если есть
                if(document.querySelector('.jsError') && !request.response.success){
                    document.querySelector('.jsError').innerHTML = request.response.message;
                }
                
                // убираем ранее выведенные ошибки
                if(document.querySelector('.jsError') && request.response.success){
                    document.querySelector('.jsError').innerHTML = '';
                }
            }
        });
       // Вот здесь мы и передаем строку с данными, которую формировали выше. И собственно выполняем запрос.
       request.send(params);
    }

<?php
// Откликаться будет ТОЛЬКО на ajax запросы методом POST
if($_SERVER['REQUEST_METHOD'] != 'POST' ) {return;}

// Сниппет будет обрабатывать не один вид запросов, поэтому работать будем по запрашиваемому действию
// Если в массиве POST нет действия - выход
if (empty($_POST['action'])) {return;}

// А если есть - работаем
$res = '';
$action = $_POST['action'];
switch ($action) {
    case 'search':
	    $res = $modx->runSnippet('searchResources');
    break;
	
	// А вот сюда потом добавлять новые методы prodFastView
}

// Если у нас есть, что отдать на запрос - отдаем и прерываем работу парсера MODX
if (!empty($res)) {
	die($res);
}

<?php
// задаем переменные
$res = [];
$query = strip_tags($_POST['query']);
$tpl = $_POST['tpl'];
if($_POST['minQuery'] && is_numeric($_POST['minQuery'])){
    $minQuery = (int)$_POST['minQuery'];
}
else{
    $minQuery = 3;
}
/*
Поля для поиска совпадений можно передать с фронта, но стоит помнить, 
что запрос делается к модели класса msProduct, 
а значит и поля можно использовать только из таблицы ms2_products и site_content.
Если нужны другие поля, то нужно либо менять класс либо использовать JOIN.
*/
if(isset($_POST['fields'])){
    $fields =  explode(',',$_POST['fields']); // строка вида  -  'pagetitle,longtitle,menutitle'
}
else{
    $fields = ['pagetitle','longtitle','menutitle']; // либо массив
}

// проверяем возможность дальнейшей работы
if(!$query){return false;}
if(mb_strlen(str_replace(' ', '', $query)) < $minQuery){
    $res = ['success' => false, 'message' => 'Количество символов в запросе должно быть больше ' . $minQuery];
    return json_encode($res);
}

// формируем запрос в БД
$where = [];
$dbQuery = $modx->newQuery('msProduct');
foreach($fields as $k => $field){
    if($k == 0){
        $where[$field.':LIKE'] = '%'.str_replace(' ', '%',$query).'%'; 
    }
    else{
        $where['OR:'.$field.':LIKE'] = '%'.str_replace(' ', '%',$query).'%';
    }
}
$dbQuery->where( $where );
$dbQuery->select(['id']);
// выполняем запрос в БД
if ($dbQuery->prepare() && $dbQuery->stmt->execute()) {
    $ids = $dbQuery->stmt->fetchAll(PDO::FETCH_COLUMN);
}
/*
Дальше возможны варианты, мне требовался поиск по товарам, 
поэтому я просто сформировал массив id-шников и вызвал сниппет msProducts,
а в целом можно писать любую логику.
*/
// если что-то найдено
if(count($ids)){
    $pdoTools = $modx->getService('pdoTools');
    $res['products'] = $pdoTools->runSnippet('msProducts', array(
                    'parents' => 9,
                    'resources'=> implode(',', $ids),
                    'limit' => 0,
                    'sortby' => ['menuindex' => 'ASC'],
                    'tpl' => $tpl
            ));
    $res['success'] = true;
}
// если ничего нет
else{
    $res = ['success' => false, 'message' => 'По запросу <b class="text-orange">«'.$query.'»</b> ничего не найдено. Попробуйте убрать окончание слова.'];
}

return json_encode($res);

<div class="container">
        {'!AjaxForm' | snippet: [
            'snippet' => 'searchResources',
            'tpl' => '@FILE chunks/blocks/service-item.html',
            'form' => '@FILE chunks/forms/searchForm.html',
            'fieldsForSearch' => 'pagetitle,longtitle,menutitle',
            'validate' => 'query:required:minLength=^3^',
            'placeholderPrefix' =>'find.'
        ]}
    </div>
 <div class="container mt-lg-4 mt-3" id="productList">
<!-- сюда будем вставлять результаты поиска -->
  </div>

<form class="row mt-lg-5">
    <div class="col-9">
        <label class="label-text par">
            <input type="text" name="query" class="input" placeholder="Например, купить в 1 клик">
        </label>
    </div>
    <div class="col-3">
        <button class="btn btn-orange btn-cart" type="submit">
            <i class="fa fa-search"></i>
        </button>
    </div>
    <div class="col-12 error_query par"><!-- сюда будем вставлять текст ошибки --></div>
</form>

$(document).on('af_complete', function(event, response){
        if (!response.success) {
            if (typeof response.data.error !== "string") {
                for (let key in response.data.error) {
                    let keys = key.split('.');
                    if ($(response.form).find('.error_' + keys[2]).length) {
                        $(response.form).find('.error_' + keys[2]).html(response.data.error[key]); // выводим текст ошибки
                    }
                }
            }
        }
        else{
            if($('#productList')){
                $('#productList').html(response.data.products); // выводим результаты поиска
            }
        }
    });

<?php
//проверяем форму
$result = $modx->runSnippet('FormIt', $scriptProperties);
foreach($modx->placeholders as $key => $ph){
    if(strpos($key, 'find.error.') === 0){
        $placeholders[$key] = $ph;
    } 
}
//если нет ошибок работаем дальше
if(!count($placeholders)){
    // задаем переменные
    $res = [];
    $query = strip_tags($_POST['query']);
    $tpl = $scriptProperties['tpl'];
    $fields = explode(',',$scriptProperties['fieldsForSearch'])  ?: ['pagetitle','longtitle','menutitle'];
    // проверяем, чтобы поля для поиска были массивом
    if(is_array($fields)){
        // формируем запрос в БД
        $where = [];
        $dbQuery = $modx->newQuery('msProduct');
        foreach($fields as $k => $field){
            if($k == 0){
                $where[$field.':LIKE'] = '%'.str_replace(' ', '%',$query).'%'; 
            }
            else{
                $where['OR:'.$field.':LIKE'] = '%'.str_replace(' ', '%',$query).'%';
            }
        }
        $dbQuery->where( $where );
        $dbQuery->select(['id']);
        // выполняем запрос в БД
        if ($dbQuery->prepare() && $dbQuery->stmt->execute()) {
            $ids = $dbQuery->stmt->fetchAll(PDO::FETCH_COLUMN);
        }
        
        // если что-то найдено
        if(count($ids)){
            $pdoTools = $modx->getService('pdoTools');
            $products = $pdoTools->runSnippet('msProducts', array(
                            'parents' => 9,
                            'resources'=> implode(',', $ids),
                            'limit' => 0,
                            'sortby' => ['menuindex' => 'ASC'],
                            'tpl' => $tpl
                    ));
            $res['success'] = true;
            return $AjaxForm->success('Результатов '.count($ids).' шт.', array('products' => $products));
        }
        // если ничего нет
        else{
            return $AjaxForm->success('По запросу «'.$query.'» ничего не найдено. Попробуйте убрать окончание слова.');
        } 
    }else{
        return $AjaxForm->error('Неверный формат параметра $fields'); 
    }
}
//если есть ошибки
else{
    return $AjaxForm->error('В форме содержатся ошибки', array('error' => $placeholders)); 
}