Вкратце вот предыстория.... В общем-то, было такое предложение по системе, сделать в форме поиска подстановку текста как у поисковых систем (Google, Яндекс и тп). В общем-то своим методом дилетанта:), подумал о том, что в принципе, можно хотя бы сделать такую же подстановку текста как у тегов при добавлении материала. Это конечно не гугл, но как фенька для сайта пойдет. Оказалось это сделать не так уж и сложно. Выдираем скрипт подстановки тегов со страницы добавления материалов и ставим его под форму поиска: Code <script type="text/javascript">new _uSuggestList('suggList','suggEdit',{separator:',',colwidth:['100%'],url:'/feat/?a=1'});</script>
Где "suggEdit" это id поля для которого будет осуществлять подстановка, его можно заменить на другой. Не помню есть ли у формы поиска выводимой спецкодом $SEARCH_FORM$ заданный id, т.к. у меня она собрана в ручную, задать id мне не составило труда. Вот в общем-то и всё.
Всё, и в самом деле не так уж и сложно, но, как почти всегда, есть одно «но» - стандартная форма поиска по сайту, что вставляется системным кодом $SEARCH_FORM$ - не имеет ID ... В остальном же все просто ... и работает.
Оригинальную тему можно посмотреть/почитать/дополнить вот здесь ... «Подстановка текста в поиске» ... А здесь и сейчас - небольшая инструкция, как всё это организовать на своём сайте. Как и написано выше - сама форма, и её составляющие, например, текстовое поле, для ввода текста, не имеют заданных идентификаторов ID, следовательно, дабы скрипт подстановки, работал правильно, да и просто работал, нужно для текстового поля (input name="q") установить ID, по которому скрипт будет получать данные о том, какие буквы вы вводите и показывать соответствующие подсказки из базы ключевых слов. Вот иходник формы поиска по сайту. Стандартный вариант. Code
<div class="searchForm">
<form onsubmit="this.sfSbm.disabled=true" method="get" style="margin: 0pt;" action="/search/">
<div class="schQuery" align="center">
<input name="q" maxlength="30" size="20" class="queryField" type="text">
</div>
<div class="schBtn" align="center">
<input class="searchSbmFl" name="sfSbm" value="Найти" type="submit">
</div>
</form>
</div>
Из исходника чётко видно, что ID нужный нам инпут не имеет, зато имеет класс, и это уже неплохо. Задача: присвоит уникальный ID этому полю. Как и обычно, воспользуюсь теми возможностями, что предоставляет нам/вам уже подключённая, по умолчанию библиотека JavaScript - jQuery, а именно возможности при работе с элементами и использовании CSS селекторов. Обратимся к форме, найдём нужный нам инпут и присвоим ему класс «suggEdit» - как и требуется в скрипте для вывода подсказок.
Я сделаю это примерно вот так: Code <script type="text/javascript">
$('div.searchForm form[action="/search/"] input.queryField').attr('id','suggEdit');
</script>
Где: div.searchForm form[action="/search/"] input.queryField - находим форму с параметрами «action="/search/"» в блоке с классом «searchForm», а в ней инпут с классом «queryField». .attr('id','suggEdit') - присваиваем ему атрибут «id» равный «suggEdit».
И теперь, после выполнения скрипта, блок с формой выглядит вот так: Code
<div class="searchForm"><form onsubmit="this.sfSbm.disabled=true" method="get" style="margin: 0pt;" action="/search/">
<div class="schQuery" align="center">
<input id="suggEdit" name="q" maxlength="30" size="20" class="queryField" type="text">
</div><div class="schBtn" align="center"><input class="searchSbmFl" name="sfSbm" value="Найти" type="submit">
</div></form></div>
Все.
Я, и надеюсь что и вы, присвоили ID нужному инпуту. Осталось, всего навсего, собрать всё это воедино. Выглядеть блок с формой поиска по сайту, вместе со скриптом для подсказки ключевых слов и с нашим скриптом будет примерно вот так.
Для глобального блока. Code
<_?if($SEARCH_FORM$)?_>
<table border="0" cellpadding="0" cellspacing="0" class="boxTable" style="overflow:visible!important;">
<tr>
<td class="boxTitle"><strong><!-- <bt> --><!--<s3163>-->Поиск по сайту<!--</s>--><!-- </bt> --></strong></td></tr>
<tr><td class="boxContent"><div align="center"><!-- <bc> -->$SEARCH_FORM$<!-- </bc> --></div></td></tr>
</table>
<script type="text/javascript">
$(function(){
$('div.searchForm form[action="/search/"] input.queryField').attr('id','suggEdit');
new _uSuggestList('suggList','suggEdit',{separator:',',colwidth:['100%'],url:'/feat/?a=1'});
});
</script>
<_?endif?_>
Получится должно что-то вроде ...
Потоптать клаву, набивая слова и посмотреть результаты работы скрипта, можно вот здесь «http://tng.ucoz.ru/»
Источник: Подстановка текста в поле формы для поиска. Скрипт Для юКоз (uCoz). JavaScript, jQuery. Инструкция | 
