Поиск на сайте очень полезен. А если это каталог или магазин, тогда это просто необходимо. Пересмотрев много решений я нашел простое дополнение SimpleSearch и немного доработал его
Вот как это работает. Доволе быстро. Как же это реализовано.?
Сначала ставим дополнение SimpleSearch вся документация по ссылке .
создаем чанк searchtpls который будет отображатся при запросе ajax.
<div class="sisea-result-castom">
<div class="resultsearch">[[+idx]]. <a href="[[+link:is=``:then=`[[~[[+id]]]]`:else=`[[+link]]`]]" title="[[+longtitle]]">[[+pagetitle]]</a></div>
</div>
Далее создаем ресурс с параметрами: Не показывать в меню, Опубликован,
Кэшируемый-снять.
Пвсевдоним — simplesearch
Содержимое
<div class="search-ajax-results">
[[!SimpleSearch? &tpl=`searchtpls` ]]
</div>
все необходимое создано. Далее в шаблоне где нужно вывести форму
landing- указать id ресурса где будет показан результат поиска после нажатия на кнопку поиска
[[!SimpleSearchForm? &landing=`40` &tpl=`search`]]
<div id="search-ajax-results-wrap"></div> блок в который выводится результат поиска ajax
Далее нужно вставить js код
найдем simplesearch.html/
и замените на свою псевдоним
в коде.
$("#search-ajax-results-wrap").load("/simplesearch.html/ .search-ajax-results",$(".sisea-search-form").serialize()).slideDown("fast");
// Кнопка
$(".search").submit(function () {
// раскоментировать если нужна кнопка
// $("#search-ajax-results-wrap").load("/simplesearch.html/ .search-ajax-results",$(".search").serialize()).slideDown("fast");
return false;
});
// Живой поиск
$("#searchId").keyup(function() {
if(this.value.length > 2) { // Пользователь набирает больше 2 символов в строке поиска
// скрывает/отображает с результаты за пределами окна
$(document).click(function(event){ // скрываем
if ($(event.target).closest(".search-ajax-results-wrap").length) return;
$(".search-ajax-results-wrap").slideUp("fast");
//event.stopPropagation();
});
$('#search').click( function() { // отображаем
$(".search-ajax-results-wrap").slideDown("fast");
return false;
});
// ajax запрос загрузка результатов поиска от страницы и показ контейнера
var parsesearc = $("#search-ajax-results-wrap").load("/simplesearch.html/ .search-ajax-results",$(".sisea-search-form").serialize()).slideDown("fast");
$("#search-ajax-results-wrap").html(parsesearc.find('.results .sisea-result'));
console.log(parsesearc.find('.sisea-result'));
}
else {
// Если набрано меньше 2 символов, скрыть контейнер (CSS display:none;)
$("#search-ajax-results-wrap").slideUp("fast");
}
});
Вы должны авторизоваться, чтобы оставлять комментарии.
Артем
- 30 ноября 2018, 13:37 ↓Admin
- 30 ноября 2018, 13:45 ↓zzherik
- 27 декабря 2018, 09:30 ↓Admin
- 27 декабря 2018, 09:39 ↓а если нужна кнопка. в скрипте есть закоментированаа строка
Альбина
- 20 ноября 2020, 12:39 ↓Поиск работает, а вот подсказка нет :(
pozitron-kip.com/
dannyarty
- 04 декабря 2020, 08:39 ↓