Хаки Live Search 1.0 - живой поиск

Администратор · Регистрация: 27.02.2009

Живой поиск - Live search 3.1.0
Поиск без перезагрузки страниц

vb.org: http://vbsupport.org/forum/showthread.php?t=26504

Возможности:

не искать, если не набрано >= 3 символов;
ограничение в количестве найденных тем;
подсветка искомого слова найденных темах;
работает с vBa и vBCMS
ограничение количества выводимых результатов
ограничения по группам
поиск по собственным разделам
сортировка найденного
делается всего один запрос к базе
полная совместимость со стилями и браузерами
поиск тем по отдельным словам (разделяя пробелом)
интеграция в стандартный поиск
поиск только по указанной длине каждого слова
поиск пользователей
интервал между запросами
AJAX подгрузка меню поиска
написаны 2 класса javascript, что позволяет скрипту дистанционно следить за полем поиска
возможность перетаскивать окна (при нажатии на стрелочку, рядом с темой, загрузится второе окно)
разделение js на 2 файла (1й инициирующий, 2й рабочий), плюс добавился третий скрипт, для загрузки скриптов, в тот момент, когда поиск понадобится

Известные проблемы: Если взаимодействовать с окном просмотра сообщения, то окно со списком найденных тем пропадет.

Установка: Залить файлы из папки upload на фтп в папку форума.
Импортировать продукт.

Обновление: Удалите хак и прилагающие к нему файлы (если были). Пройдите этап установки. Если вы редактировали шаблоны хака - "верните" и

Настройка: Для более цивильного размещения формы через переменную $lsaform, могу предложить хорошее место

В шаблоне navbar выше этого:

PHP код:



<if condition="$show['member']">
    <td class="alt2" nowrap="nowrap">
    <div class="smallfont">
        <strong><phrase 1="$bbuserinfo[username]"  2="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[welcome_x_link_y]</phrase></strong><br  />

Добавляем этот код:

PHP код:



    <td class="alt1" align="center" nowrap="nowrap">
        $lsaform
    </td>

Форма поиска разместится слева от блока Добро пожаловать, Юзер

Если вы уже имеете свою форму поиска и хотите прикрутить к ней AJAX, делаем следующее.
Форма поиска выглядит примерно так:

PHP код:



<form action="search.php?do=process" method="post">
    <input type="hidden" name="do" value="process" />
    <input type="hidden" name="quicksearch" value="1" />
    <input type="hidden" name="childforums" value="1" />
    <input type="hidden" name="exactname" value="1" />
    <input type="hidden" name="s" value="$session[sessionhash]" />
    <input type="hidden" name="securitytoken" value="$bbuserinfo[securitytoken]" />
    <input type="text" class="bginput" name="query" size="25" tabindex="1001" />
    <input type="submit" class="button" value="$vbphrase[go]" tabindex="1004" />
</form>

Итак, после открытия тега <form ХХХ> добавляем ниже:

PHP код:



<div id="lsa_window">

Перед закрывающим тегом </form> добавляем:

PHP код:



</div>

Мы подготовили форму поиска для всплывающего окна. Теперь нам нужно привязать к этому полю javascript.
Для этого в теге <input type="text" /> добавляем id="lsa_input":

В итоге у вас должен получиться такой примерно код:

PHP код:



<form action="search.php?do=process" method="post">
    <div id="lsa_window">
    <input type="hidden" name="do" value="process" />
    <input type="hidden" name="quicksearch" value="1" />
    <input type="hidden" name="childforums" value="1" />
    <input type="hidden" name="exactname" value="1" />
    <input type="hidden" name="s" value="$session[sessionhash]" />
    <input type="hidden" name="securitytoken" value="$bbuserinfo[securitytoken]" />
    <input type="text" id="lsa_input" class="bginput" name="query" size="25" tabindex="1001" />
    <input type="submit" class="button" value="$vbphrase[go]" tabindex="1004" />
    </div>
</form>

Если в вашем поле поиска уже есть id и его смена может сбросить возможную привязку CSS, делаем следующее.
Открываем шаблон lsa_script и редактируем строчку

PHP код:



var lsa = new AJAX_LiveSearch_Init("lsa", "lsa_input", "lsa_window");

где аргументы класса:
lsa - имя переменной инициализирующий класс js;
lsa_input - id поля поиска;
lsa_window - id всплывающего окна;

Т.о., изменяя аргументы класса AJAX_LiveSearch_Prepare, вы можете не редактировать поле поиска.

PS. Часть функций взята из ChangUonDyU - Quick Search - Ajax
Скачать

Live Search 1.0 - быстрый живой поиск на ajax

Live Search 1.0 - быстрый живой поиск на ajax

1- Добавить в конец шаблона "headinclude" :

PHP код:



<script type="text/javascript">
/***********************************************
* Drop Down/ Overlapping Content- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
function getposOffset(overlay, offsettype){
var totaloffset=(offsettype=="left")? overlay.offsetLeft : overlay.offsetTop;
var parentEl=overlay.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function overlay(curobj, subobjstr, opt_position){
if (document.getElementById){
var subobj=document.getElementById(subobjstr)
subobj.style.display="block"
var xpos=getposOffset(curobj, "left")+((typeof opt_position!="undefined" && opt_position.indexOf("right")!=-1)? -(subobj.offsetWidth-curobj.offsetWidth) : 0) 
var ypos=getposOffset(curobj, "top")+((typeof opt_position!="undefined" && opt_position.indexOf("bottom")!=-1)? curobj.offsetHeight : 0)
subobj.style.left=xpos+"px"
subobj.style.top=ypos+"px"
return false
}
else
return true
}

function overlayclose(subobj){
document.getElementById(subobj).style.display="none"
}
var xmlHttp3 
function showHint(word) 
{ 
document.getElementById('search_results').innerHTML = '<p></p><p></p><p align="center" class="smallfont"><img src="http://pcvector.ru/images/progress.gif" /> Подождите ...</p>';
    xmlHttp3=GetXmlHttpObject3() 
    if (xmlHttp3==null) 
    { 
        alert ("Browser does not support HTTP Request") 
        return 
    } 
    var url="ajax_search.php" 
    url=url+"?query="+word 
    xmlHttp3.onreadystatechange=stateChanged3 
    xmlHttp3.open("GET",url,true) 
    xmlHttp3.send(null) 
} 

function stateChanged3() 
{ 
    if (xmlHttp3.readyState==4 || xmlHttp3.readyState=="complete") 
    { 
        document.getElementById("search_results"). innerHTML='<div align="left"><a href="#" onClick="overlayclose(\'search_results\'); return false">x</a></div>'+xmlHttp3.responseText; 
return overlay(this, 'search_results')
    } 
} 

function GetXmlHttpObject3() 
{ 
    var objXMLHttp3=null 
    if (window.XMLHttpRequest) 
    { 
        objXMLHttp3=new XMLHttpRequest() 
    } 
    else if (window.ActiveXObject) 
    { 
        objXMLHttp3=new ActiveXObject("Microsoft.XMLHTTP") 
    } 
    return objXMLHttp3 
}
</script>

2- Добавить следующий код в то место где хотите увидеть форму поиска, например в "header" или в navbar:

PHP код:



<form action="search.php?do=process" method="post">
<input type="hidden" name="do" value="process" />
<input type="hidden" name="quicksearch" value="1" />
<input type="hidden" name="childforums" value="1" />
<input type="hidden" name="exactname" value="1" />
<input type="hidden" name="s" value="$session[sessionhash]" />
Живой поиск <input type="text" name="query" size="25" class="header_search_field" onkeyup="showHint(this.value)" />
</form>
<div id="search_results" class="smallfont" style="position:absolute; border: 2px solid orange; color:blue; background-color: white; width: 300px; padding: 8px; display:none;overflow:auto; height:200px">
<div align="left"><a href="#" onClick="overlayclose('search_results'); return false">x</a></div>
</div>
</div>

Например в navbar после кода:

Код HTML:

<div class="navbar" style="font-size:10pt"><a href="$vboptions[forumhome].php$session[sessionurl_q]" accesskey="1"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_start.gif" alt="" border="0" /></a> <strong>$vboptions[bbtitle]</strong></div>
        </if>
    </td>

Поместив между:

Код HTML:

<td class="alt1">
<div align="center" style="width:188px">
................
</td>
</div>

3- Загрузить файлы из папки upload в корень форума.

Скачать

[-]

Пользователь · 31.10.2011, 23:57

Цитата:

Сообщение от Vector

Vector скажи что я не так сделал что мой пойск вот так отображаеться? сделал все по инструкции но он показывает мо шаблон из нутри а не даные с форума.

не поиму бробовал и так и сяк полная хрень у меня теперь даже мой пойск париться начал.. что я не так сделал?

Администратор · 01.11.2011, 19:14

Поставь новую версию. Тема обновлена.

Пользователь · Регистрация: 03.05.2012

Подскажите в каком месте поменять ширину этого поиска? Много способов попробовал - не получается, всегда получается ~150 пикселов.

Администратор · Регистрация: 27.02.2009

А ваш скриншот можно или ссылку на форум (и более конкретно ширину поля ввода, или ширину всплывающего окошка ?)

Пользователь · Регистрация: 30.04.2012

Здравствуйте. Недавно установил этот поиск. Но что-то не пойму. Там можно выбрать поиск по сообщениям, или только по темам? Кнопки для выбора не нажимаются.

Пользователь · Регистрация: 08.07.2012

а тут тоже живой поиск? на форме этом имеется ввиду, или нет?

Опции темы
Версия для печати Отправить по электронной почте
Опции просмотра
Линейный вид Комбинированный вид Древовидный вид

Vector #3
7630 МГц Администратор Вес репутации: 0 Регистрация: 27.02.2009 Адрес: Москва Сообщений: 7,302 Сказал(а) спасибо: 578 Спасибок 2,623 в 1,832 сообщениях	01.11.2011, 19:14 Поставь новую версию. Тема обновлена.

asd #7
70 МГц Пользователь Вес репутации: 0 Регистрация: 08.07.2012 Сообщений: 322 Сказал(а) спасибо: 15 Спасибок 5 в 5 сообщениях	Re: Live Search 1.0 - живой поиск - 11.06.2014, 13:59 а тут тоже живой поиск? на форме этом имеется ввиду, или нет?