для вот такого аjax поиска нам нужно не много.
файл search.php , в нужной вам папке (написано на d7 c костылем)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
<?php /** * Created by PhpStorm. * User: * Date: 14.09.2018 * Time: 12:51 */ require($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/prolog_before.php"); CModule::IncludeModule("iblock"); //http://ck21318.tmweb.ru/include/ajax/search.php?text=краб \Bitrix\Main\Loader::includeModule('iblock'); $text=$_REQUEST['text']; $dbItems = \Bitrix\Iblock\ElementTable::getList(array( 'select' => array('ID', 'NAME', 'IBLOCK_ID' , 'PREVIEW_PICTURE', ), //,'DETAIL_PAGE_URL' 'filter' => array('IBLOCK_ID' => 12 ,'NAME'=>'%'.strip_tags($text).'%'), 'limit'=>10 )); $arrResult=array(); while ($arItem = $dbItems->fetch()){ //DETAIL_PAGE_URL d7 не выводит!!! $el_res= CIBlockElement::GetByID( $arItem['ID'] ); if ( $el_arr= $el_res->GetNext() ) { $arItem['DETAIL_PAGE_URL']= $el_arr[ 'DETAIL_PAGE_URL' ]; $arItem['PREVIEW_PICTURE']= CFile::GetPath( $el_arr[ 'PREVIEW_PICTURE' ] ) ; } // debug($arItem); $arrResult[]=$arItem; } foreach ($arrResult as $item){ ?> <a href="<?=$item['DETAIL_PAGE_URL']?>" class="tip"> <div class="thumb"> <img style="width:100%" src="<?=$item['PREVIEW_PICTURE']?>" alt=""> </div> <div class="info"> <!-- <div class="cat">Мебель для ванной</div>--> <div class="name"><?=$item['NAME']?></div> </div> <div class="link">Перейти к товару</div> </a> <?php } ?> |
js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
$('header .search .input').keydown(function(){ var _self = $(this) setTimeout(function() { if( _self.val().length > 2 ){ // число 2 можно менять, число 2 значит что запрос выполнится только если введено минимум 3 символа в строку поиска. // Здесь ajax запрос на сервер со вставкой результата $('header .search .tips').fadeIn(300) var text=_self.val(); var url="/include/ajax/search.php?text="+text; $.ajax({ type: "GET", dataType: "html", url: url, success: function(data){ $('header .search .tips .scroll').html(data); } }); } else { $('header .search .tips').fadeOut(200) } }, 10) }) |