Page locked

This page is currently locked for editing by another user. You have to wait until this user finishes editing or the lock expires.
Currently locked by: 3.145.50.71
Lock expires at: 29.04.25 в 23:08 (6 min)
This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Автодополнение в строке поиска ======


В этой статье описано, как реализовать такое автодополнение вариантов поиска в редакции Халява
{{:private:koding:hostcms:shop:12e3.jpg|}}

такую функцию выполняет плагин Autocomplete | jQuery UI. 

Свежую версию плагина можно скачать на Github'е: https://github.com/devbridge/jQuery-Autocomplete

  - Необходимо добавить загруженные файлы скрипта и стилей на сервер ''styles.css'' и ''jquery.autocomplete.min.js'' в папки ''css'' и ''js'' соответственно.
  - Подключить эти файлы в основном макете сайта
  - В основной макет сайта в блок ''head'' добавить следующий код: <code html>
<script type="text/javascript">
  $(function() {
    //для строки поиска в шапке
    $('#search_text).autocomplete({
      serviceUrl: '/shop/?autocomplete=1', // Страница для обработки запросов автозаполнения
      minChars: 1, // Минимальная длина запроса для срабатывания автозаполнения
      maxHeight: 300, // Максимальная высота списка подсказок, в пикселях
      width: 200, // Ширина списка
      zIndex: 9999, // z-index списка
      deferRequestBy: 300, // Задержка запроса (мсек)
      // Дополнительные параметры
      onSelect: function (suggestion) {
        $(this).closest("form").submit();
      }
    });

  });
</script></code>
  - Для ''<input>'', у которого должен выводиться выпадающий список добавляете ''id="search_text"'' 
  - В ТДС, в Настройки страницы интернет магазина добавить код: (данный пример кода ищет варианты автозаполнения по имени и артикулу) <code php>

/**
*  Поиск товаров для автозаполнения
* 
* @author Malinovskii Aleksandr, KAD Systems (©) 2015
* @date 24-11-2015	
* Начало >>
*/

if (Core_Array::getGet('autocomplete'))
{
	$aResultJson = array();
	$sQuery=Core_Array::getGet('query');
	
	$aResultJson['query'] = $sQuery;
	$aResultJson['suggestions'] = array();
	
	//ищем совпадающие запросу имена
	$aResultName = Core_QueryBuilder::select(array('shop_items.name', 'value'))
		->from('shop_items')
		->where('shop_items.name', 'LIKE', '%'.$sQuery.'%')
		->setAnd()
		->where('shop_items.shop_id', '=', '5')->setAnd()
		->where('shop_items.active', '=', '1')->setAnd()
		->where('shop_items.deleted', '=', '0');	
	
	//аналогично ищем артикули
	$aResultMarking = Core_QueryBuilder::select(array('shop_items.marking', 'value'))
		->from('shop_items')
		->where('shop_items.marking', 'LIKE', '%'.$sQuery.'%')
		->setAnd()
		->where('shop_items.shop_id', '=', '5')->setAnd()
		->where('shop_items.active', '=', '1')->setAnd()
		->where('shop_items.deleted', '=', '0');	
	
	
	$aResultJson['suggestions'] = array_merge($aResultName->execute()->asAssoc()->result(), $aResultMarking->execute()->asAssoc()->result()) ;
	
	echo json_encode($aResultJson);
	exit();
}

/**
* << Конец 
* @author Malinovskii Aleksandr, KAD Systems (©) 2015
* @date 24-11-2015
*/
</code>
KAD::Wiki

User Tools

Site Tools

Page locked

Page Tools
